Skip to content

Centre de préférences des e-mails via API

La mise en place d’un centre de préférences offre à vos utilisateurs un point d’accès unique pour modifier et gérer leurs préférences de notification pour votre envoi de messages par e-mail. Cet article décrit les étapes pour créer un centre de préférences généré par API, mais vous pouvez également créer un centre de préférences à l’aide de l’éditeur par glisser-déposer.

Dans le tableau de bord de Braze, accédez à Audience > Email Preference Centers.

C’est ici que vous pouvez gérer et consulter chaque groupe d’abonnement. Chaque groupe d’abonnement que vous créez est ajouté à cette liste de centres de préférences. Vous pouvez créer plusieurs centres de préférences.

Créer un centre de préférences avec l’API

En utilisant les endpoints Braze du centre de préférences, vous pouvez créer un centre de préférences, un site web hébergé par Braze, qui peut afficher l’état d’abonnement et les statuts des groupes d’abonnement de vos utilisateurs. En utilisant HTML et CSS, votre équipe de développement peut créer le centre de préférences afin que le style de la page corresponde à vos directives de marque.

L’utilisation de Liquid vous permet de récupérer les noms de vos groupes d’abonnement ainsi que le statut de chaque utilisateur. De cette façon, Braze stocke et récupère ces données lorsque la page est chargée.

Conditions préalables

Étape 1 : Utiliser l’endpoint de création du centre de préférences

Commençons par créer un centre de préférences à l’aide de l’endpoint de création du centre de préférences. Pour personnaliser votre centre de préférences, vous pouvez inclure du HTML conforme à votre image de marque dans le champ preference_center_page_html et le champ confirmation_page_html.

L’endpoint de génération d’URL du centre de préférences vous permet de récupérer l’URL du centre de préférences pour un utilisateur spécifique en dehors d’un e-mail envoyé via Braze.

Étape 2 : Inclure dans votre campagne e-mail

Pour placer un lien vers le centre de préférences dans vos e-mails, utilisez l’étiquette Liquid suivante à l’endroit souhaité dans votre e-mail, de la même manière que vous inséreriez des URL de désabonnement.

1

{{preference_center.${kitchenerie_preference_center_example}}}

Vous pouvez également utiliser une combinaison de HTML incluant du Liquid. Par exemple, vous pouvez coller ce qui suit comme URL dans l’éditeur HTML ou l’éditeur par glisser-déposer. Cela affiche la disposition de base du centre de préférences qui répertorie automatiquement tous les groupes d’abonnement e-mail. Si vous utilisez l’aliasage de lien, ajoutez un point d’interrogation final (?) après l’étiquette Liquid afin que Braze puisse ajouter les paramètres de suivi.

1

<a href="{{preference_center.${kitchenerie_preference_center_example}}}?">Edit your preferences</a>

Le centre de préférences dispose d’une case à cocher permettant à vos utilisateurs de se désabonner de tous les e-mails. Notez que vous ne pouvez pas enregistrer ces préférences si elles sont envoyées en tant que message de test.

Modifier un centre de préférences

Vous pouvez modifier et mettre à jour votre centre de préférences en utilisant l’endpoint de mise à jour du centre de préférences.

Identifier les centres de préférences et leurs détails

Pour identifier vos centres de préférences, utilisez l’endpoint d’affichage des détails du centre de préférences pour renvoyer des informations associées telles que l’horodatage de la dernière mise à jour, l’ID du centre de préférences, et plus encore.

Personnaliser un centre de préférences

Braze gère les mises à jour de l’état d’abonnement depuis le centre de préférences, ce qui maintient le centre de préférences synchronisé. Cependant, vous pouvez également créer et héberger votre propre centre de préférences en utilisant les API des groupes d’abonnement avec les options suivantes.

Utilisez des paires champ-valeur de chaîne de requête dans le corps de l’URL pour transmettre l’ID utilisateur et la catégorie d’e-mail à la page afin que les utilisateurs n’aient qu’à confirmer leur choix de désabonnement. Cette option convient à ceux qui stockent un identifiant utilisateur sous forme hachée et qui ne disposent pas déjà d’un centre d’abonnement.

Pour cette option, chaque catégorie d’e-mail nécessite son propre lien de désabonnement spécifique :
http://mycompany.com/query-string-form-fill?field_id=John&field_category=offers

Option 2 : Authentifier avec un jeton web JSON

Utilisez un jeton web JSON pour authentifier les utilisateurs sur une partie de votre serveur web (par exemple, les préférences de compte) qui se trouve normalement derrière une couche d’authentification telle qu’un identifiant et un mot de passe.

Cette approche ne nécessite pas de paires de valeurs de chaîne de requête intégrées dans l’URL, car celles-ci peuvent être transmises dans le payload du jeton web JSON, par exemple :

1
2
3
4
5

{
    "user_id": "1234567890",
    "name": "John Doe",
    "category": "offers"
}

Foire aux questions

Je n’ai pas créé de centre de préférences. Pourquoi est-ce que je vois « PreferenceCenterBrazeDefault » sur mon tableau de bord ?

Cela est utilisé pour afficher le centre de préférences lorsque le Liquid hérité ${preference_center_url} est utilisé, ce qui signifie que les étapes du Canvas ou les modèles qui font référence à ${preference_center_url} ou preference_center.${PreferenceCenterBrazeDefault} ne fonctionneront pas. Cela s’applique également aux messages précédemment envoyés qui incluaient le Liquid hérité ou « PreferenceCenterBrazeDefault » dans le message.

Si vous faites référence à ${preference_center_url} dans un nouveau message, un centre de préférences nommé « PreferenceCenterBrazeDefault » sera créé à nouveau.

Les centres de préférences prennent-ils en charge plusieurs langues ?

Non. Cependant, vous pouvez utiliser Liquid lors de la rédaction du HTML pour les pages personnalisées d’abonnement et de désabonnement. Si vous utilisez des liens dynamiques pour gérer les désabonnements, il s’agit d’un lien unique.

Par exemple, si vous suivez le taux de désabonnement des utilisateurs hispanophones, vous devrez soit utiliser des campagnes distinctes, soit exploiter les analyses autour de Currents (comme vérifier quand un utilisateur se désabonne et consulter la langue préférée de cet utilisateur).

Autre exemple : pour suivre les taux de désabonnement des utilisateurs hispanophones, vous pourriez ajouter une chaîne de paramètre de requête comme ?Spanish=true à l’URL de désabonnement si la langue de l’utilisateur est l’espagnol, et utiliser un lien de désabonnement classique dans le cas contraire :

1
2
3
4

{% if ${language} == 'spanish' %} "${unsubscribe_url}?spanish=true"
{% else %}
${unsubscribe_url}
{% endif %}

Ensuite, via Currents, vous pourriez identifier quels utilisateurs parlent espagnol et combien d’événements de clic il y a eu pour ce lien de désabonnement.

Non. Si vous voyez le message « Your Email Body does not include an unsubscribe link » lors de la composition d’une campagne e-mail, cet avertissement est attendu si votre lien de désabonnement se trouve dans un bloc de contenu.

Comment mettre à jour l’icône par défaut du navigateur ?

Par défaut, l’icône à côté du nom de l’onglet du navigateur (favicon) utilise le logo Braze. Pour ajouter un favicon personnalisé, vous le définissez via l’attribut links-tags dans votre appel API de création ou de mise à jour du centre de préférences. Braze injecte ensuite la balise <link rel="icon" ...> dans la page hébergée pour vous.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

{
  "name": "MyPreferenceCenter",
  "preference_center_title": "Email Preferences",
  "preference_center_page_html": "<!doctype html> ...",
  "confirmation_page_html": "<!doctype html> ...",
  "state": "active",
  "options": {
    "links-tags": [
      {
        "rel": "icon",
        "type": "image/png",
        "sizes": "32x32",
        "href": "https://yourcdn.com/path/to/favicon-32x32.png"
      },
      {
        "rel": "shortcut icon",
        "type": "image/x-icon",
        "href": "https://yourcdn.com/path/to/favicon.ico"
      },
      {
        "rel": "apple-touch-icon",
        "sizes": "180x180",
        "href": "https://yourcdn.com/path/to/apple-touch-icon.png"
      }
    ]
  }
}
New Stuff!