Création de modèles d'email
Après avoir créé un modèle d’email, utilisez le concepteur visuel pour créer les composants structurels et de contenu dans votre modèle d’email.
Ajouter la structure et le contenu structure-content
-
Pour commencer la conception de contenu, faites glisser un élément de l’élément Structures et déposez-le sur la zone de travail.
Ajoutez autant d'éléments de Structures que nécessaire et modifiez les paramètres de chacun dans le volet de droite.
note tip TIP Sélectionnez le composant n:n column pour définir le nombre de colonnes de votre choix (entre trois et dix). Vous pouvez également définir la largeur de chaque colonne en déplaçant les flèches sous la colonne. {width="800" modal="regular"}
La taille de chaque colonne ne peut pas être inférieure à 10 % de la largeur totale du composant de structure. Seules les colonnes vides peuvent être supprimées.
-
Développez la section Contenu et ajoutez autant d’éléments que nécessaire dans un ou plusieurs composants de structure.
{width="800" modal="regular"}
-
Si nécessaire, vous pouvez effectuer des personnalisations supplémentaires pour chaque composant dans les onglets Paramètres ou Style .
Par exemple, vous pouvez modifier le style de texte, la marge ou la marge intérieure de chaque composant.
-
Pour ajouter du contenu conditionnel et adapter le contenu aux profils ciblés selon des règles conditionnelles, sélectionnez un composant de contenu et cliquez sur l’icône Activer le contenu conditionnel dans la barre d’outils du composant.
Pour plus d’informations, voir Contenu conditionnel.
Ajouter des fragments
Dans l’éditeur visuel de contenu, l’icône Fragments s’affiche sur la gauche. L’exemple suivant décrit les étapes à suivre pour ajouter des fragments au contenu du modèle.
-
Pour ouvrir la liste des fragments, sélectionnez l’icône Fragments ( ).
Vous pouvez effectuer les actions suivantes :
- Triez la liste.
- Parcourir, rechercher ou filtrer la liste.
- Basculez entre les modes Miniature et Liste.
- Actualisez la liste pour refléter les fragments récemment créés.
{width="700" modal="regular"}
-
Faites glisser et déposez l’un des fragments dans l’espace réservé du composant structurel.
L’éditeur effectue le rendu du fragment dans la section/l’élément de la structure de l’email.
Le contenu du fragment est mis à jour dynamiquement dans la structure afin d’afficher la manière dont le contenu apparaît dans l’email.
Une fois l’email enregistré, il apparaît dans la page des détails du fragment lorsque vous sélectionnez l’onglet Utilisé par dans le résumé. Les fragments ajoutés à un modèle d’email ne sont pas modifiables dans le modèle : le fragment source définit le contenu.
Ajout de ressources
Dans l’éditeur de contenu visuel, sélectionnez l’icône Assets ( ) qui s’affiche à gauche.
L’exemple suivant décrit les étapes à suivre pour ajouter des ressources au contenu du modèle :
-
Pour ouvrir la bibliothèque de ressources, cliquez sur l’icône Assets .
À partir du sélecteur de ressources, vous pouvez sélectionner directement des ressources stockées dans la bibliothèque source.
-
Ajoutez une nouvelle ressource en la faisant glisser dans un composant de structure.
{width="800" modal="regular"}
Pour plus d’informations sur l’utilisation des ressources de votre type source, voir Ajout de ressources à votre contenu.
-
Remplacez une ressource image existante en la sélectionnant sur la zone de travail, puis en cliquant sur Sélectionner une ressource dans les outils de source d’image.
{width="600" modal="regular"}
Navigation dans les calques, paramètres et styles
Lorsque vous travaillez avec le contenu du concepteur visuel, vous pouvez accéder aux calques/conteneurs et aux éléments à l’aide de l’arborescence Navigation. Cliquez sur l’icône Navigation pour afficher l’arborescence à gauche de la zone de travail.
{width="800" modal="regular"}
L'exemple suivant décrit les étapes à suivre pour ajuster la marge intérieure et l'alignement vertical à l'intérieur d'un composant de structure composé de colonnes.
-
Sélectionnez la colonne dans le composant de structure directement dans la zone de travail ou à l’aide de l’Arborescence de navigation affichée à gauche.
-
Dans la barre d'outils des colonnes, cliquez sur l'outil Sélectionner une colonne et choisissez celle que vous souhaitez modifier.
Vous pouvez également la sélectionner dans l'arborescence. Les paramètres modifiables pour cette colonne sont affichés dans les onglets Paramètres et Styles à droite.
{width="800" modal="regular"}
-
Pour modifier les propriétés de colonne, cliquez sur l’onglet Styles à droite et modifiez-les selon vos besoins :
-
Pour Background, modifiez la couleur d’arrière-plan selon les besoins.
Décochez la case pour un arrière-plan transparent. Activez le paramètre Image d'arrière-plan pour utiliser une image comme arrière-plan au lieu d'une couleur unie.
-
Pour Alignement, sélectionnez l’icône Haut, Milieu ou Bas.
-
Pour Marge intérieure, définissez la marge intérieure de tous les côtés.
Sélectionner Marge intérieure différente pour chaque côté si vous souhaitez mieux définir la marge intérieure. Cliquez sur l’icône Verrouiller pour interrompre la synchronisation.
-
Développez la section Avancé pour définir des styles intégrés pour la colonne.
{width="700" modal="regular"}
-
-
Si nécessaire, répétez ces étapes pour ajuster l’alignement et la marge intérieure des autres colonnes du composant.
-
Enregistrez vos modifications.
Personnaliser le contenu
Journey Optimizer B2B Edition utilise une syntaxe simple intégrée qui vous permet de créer des expressions avec du contenu personnalisé encadré de doubles accolades {}
. Vous pouvez ajouter plusieurs expressions dans le même contenu ou champ sans restriction.
Exemples :
-
Hello {{profile.person.name.firstName}} {{profile.person.name.lastName}}
-
Hello {{profile.person.name.fullName}}
Lors du traitement du message (email et SMS), Journey Optimizer B2B Edition remplace l'expression par les données contenues dans la base de données Experience Platform. Ainsi, le premier exemple devient Hello John Doe.
L’exemple suivant décrit les étapes de personnalisation du contenu à l’aide des attributs de prospect/compte et des jetons système.
-
Sélectionnez le composant de texte et cliquez sur l’icône Ajouter la personnalisation de la barre d’outils.
{width="600"}
Cette action ouvre la boîte de dialogue Modifier Personalization.
-
Cliquez sur + ou … pour ajouter un jeton à l’espace vide.
{width="700" modal="regular"}
-
Cliquez sur Enregistrer.
Modification du suivi des URL liées
-
Cliquez sur l'icône Liens à gauche pour afficher toutes les URL de votre contenu à suivre.
-
Si nécessaire, cliquez sur l'icône Edit (crayon) et modifiez le Tracking Type ou le Label.
Vous pouvez également ajouter balises pour un lien.
{width="500"}
Options d’affichage
Tirez parti des options de vue et de validation du contenu disponibles dans le concepteur visuel.
-
Zoom avant/arrière sur le contenu sur les options de zoom prédéfinies.
-
Basculez l’affichage du contenu sur Bureau, Mobile ou Texte unique/Texte brut.
- Cliquez sur l’icône OEil pour afficher l’aperçu du contenu sur tous les appareils.
- Sélectionnez l’un des appareils prêts à l’emploi ou saisissez des dimensions personnalisées pour prévisualiser le contenu.
Plus d’options
Dans le menu Plus… situé en haut du Concepteur d'email, vous pouvez effectuer les actions suivantes :
{width="500"}
- Réinitialiser le modèle - Cliquez sur cette option pour effacer le canevas du concepteur visuel sur une barre d’outils vide et redémarrer le contenu de création.
- Enregistrer en tant que fragment - Enregistrez toutes ou parties du modèle en tant que fragment à réutiliser dans plusieurs emails ou modèles de courrier électronique. Vous fournissez un nom et une description pour le fragment et vous l’enregistrez dans la liste des fragments disponibles.
- Modifiez votre conception - Revenez à la page Concevez votre modèle. À partir de là, vous pouvez choisir de entièrement concevoir votre modèle ou d’utiliser un modèle existant pour redémarrer le processus de conception.
- Exporter l’HTML - Téléchargez le contenu dans la zone de travail visuelle vers votre système local au format d’HTML présenté sous la forme d’un fichier zip.