Choisir les paramètres de votre email
Comment utiliser les blocs
Ajouter du contenu dans vos blocs
Avoir un aperçu de votre design
Quelques conseils et bonnes pratiques
Le Message Builder est un éditeur email intuitif et drag and drop intégré dans le module Designer. Pour accéder au Message Builder, cliquez sur « Nouvel Email » ou utilisez le raccourci (N+E sur votre clavier). Veuillez noter que le Message Builder et l'éditeur HTML fonctionnent séparément, si vous commencez à créer un design dans Message Builder, l'onglet Éditeur HTML sera grisé et vice-versa.
Dans Message Builder, les contenus sont les éléments que vous pouvez placer dans votre message, comme du texte, des images, etc. Les blocs définissent la structure du message et offrent des espaces pour insérer du contenu. Les paramètres sont des options qui s’appliquent à l’ensemble de votre email. Cet article est structuré selon cette logique et met en exergue les fonctionnalités les plus utiles et quelques conseils d'utilisation. Nous avons choisi de ne pas énumérer toutes les fonctionnalités disponibles, mais avons sélectionné celles que vous pourriez ne pas connaître ou comprendre à première vue.
Choisir les paramètres de votre email
Cet onglet du menu vous permet de modifier les paramètres de votre email en entier.
Vous pouvez définir, entre autres, la largeur du message, les couleurs du fond et des liens, ainsi que la police par défaut.
Nous vous recommandons d'éviter de dépasser les 600 pixels de largeur, qui est un maximum pour la plupart des clients email.
Couleurs et sauvegarde des couleurs
Vous pouvez sélectionner des couleurs grâce au code hexadécimal ou bien manuellement. Le Message Builder se souviendra des couleurs que vous avez utilisées précédemment dans votre univers, ce qui vous fera gagner du temps à vous et à vos collègues.
Comment utiliser les blocs
Une fois que vous avez configuré les paramètres globaux de votre email, vous pouvez créer la structure en faisant glisser les blocs que vous souhaitez ajouter. Les blocs sont les équivalents des lignes.
Les blocs peuvent être dupliqués, supprimés et sauvegardés pour utilisation future (une fois le contenu ajouté).
Propriétés et options des blocs
La sélection d'un bloc vous permet d’en modifier les paramètres, comme par exemple :
- la couleur du fond
- l'image de fond
- l'espacement (la distance interne dans un bloc qui sépare le contenu de la bordure)
- la bordure
- ajouter des colonnes
- l'option « ne pas empiler sur mobile » (lorsqu'un bloc contient plus d’une colonne, le contenu de chaque colonne sera affiché horizontalement sur les ordinateurs et verticalement sur les téléphones. Vous pouvez désactiver ce comportement à travers cette option)
- cacher sur mobile/desktop
Sauvegarder les blocs
Une fois que vous avez ajouté du contenu à votre ligne, vous pouvez facilement l'enregistrer en cliquant en dehors de la ligne du contenu, sur la structure de la ligne, pour trouver l'icône « disquette » (voir capture ci-dessous).
Si vous cliquez sur l'icône « disquette », vous enregistrerez votre bloc et pourrez le réutiliser dans vos prochains designs. Les blocs enregistrés seront stockés sous « Designer > Contenus sauvegardés ».
Ajouter du contenu dans vos blocs
Nous avons listé ci-dessous quelques points saillants concernant le contenu que vous pouvez insérer dans Message Builder. Veuillez noter qu’il est essentiel d’ajouter des blocs au sein de la même ligne si vous souhaitez que leur contenu s'affiche de manière responsive (c'est-à-dire image + son CTA). Si vous ajoutez vos blocs dans des lignes séparées, ils seront considérés comme un contenu séparé. Par conséquent, votre email peut être affiché avec du contenu au mauvais endroit lorsqu'il est consulté sur des écrans responsifs.
Quelques éléments à prendre en compte concernant les blocs de contenu :
- Si vous souhaitez ajouter un effet groupé à vos blocs, vous pouvez jouer avec le remplissage. Il vous suffit pour cela de sélectionner le bloc et d'aller dans le menu de contrôle > remplissage.
- Actuellement, il n'est pas possible d'ajouter des effets de survol lorsque la souris est sur un bloc spécifique.
- Il n’est pas possible de rendre un bloc entier cliquable, mais vous pouvez insérer des liens derrière les images, CTA, bloc de texte, etc.
Liens miroir et de désinscription (disponibles lorsque vous ajoutez « Texte »)
Ces liens se trouvent dans un bloc de texte > liens spéciaux > liens et peuvent être insérés directement dans le bloc de texte.
Fusionner les balises et autres options de personnalisation (dans des blocs de texte)
L'option « fusionner les balises » vous offre une liste de balises à insérer depuis votre base de données (pour les champs système et custom). Le bouton « plus » ouvre un onglet contenant la librairie complète des syntaxes disponibles.
Si vous tapez « @ » puis les premières lettres du champ que vous voulez afficher, une fonction de remplissage automatique vous aidera à le trouver parmi les champs de votre base de données.
Images dynamiques
Les images dynamiques peuvent changer en fonction d'une ou plusieurs valeurs qui seront « transmises » au système qui les fournit. Ce type d'URL contient certaines variables, telles qu'un email, un ID client, une date, etc.
https://spliotraining.com/images/?imageBanner={{customer_ID}}
Les variables sont des balises fusionnées dans l'URL et sont remplacées par des valeurs réelles (par exemple, l'ID d'un client, l'adresse email du destinataire, le nom de la personne, etc.) au moment de l'envoi de l'email ou lorsque la page d'accueil s'affiche.
Les images dynamiques sont une option dans le bloc de contenu « image ». Cette option est notamment utilisée lorsque vous souhaitez insérer des images dans des boucles de produits. Pour plus d'informations sur les boucles, vous pouvez consulter notre article à ce sujet.
Collez l’Url du contenu dynamique dans ce champ.
Transférez des variables dans cette URL à laquelle votre serveur peut répondre par des graphiques ou des contenus appropriés.
Les images dynamiques peuvent être, par exemple, des cartes personnalisées, des recommandations de produits, des publicités, etc.
Veuillez noter que le champ URL dynamique ne sera visible que lorsqu'un fichier d'image a été sélectionné dans le bloc de contenu d'image.
Si vous activez l'option de l'image dynamique mais laissez le champ URL vide, le code HTML de votre email sera généré normalement et utilisera l'image statique, ignorant ainsi les paramètres dynamiques.
Enfin, lorsque vous utilisez cette option, vous pouvez utiliser la syntaxe et/ou les caractères que vous souhaitez, à l'exception de « ? », qui ne peut être utilisé qu'une seule fois dans votre URL, et des guillemets qui pourraient causer la rupture de votre lien.
Syntaxe HTML dans les blocs
Le Message Builder permet un vocabulaire HTML limité pour assurer la réactivité et la délivrabilité de vos messages. Il essayera de fermer les balises ouvertes et d'en supprimer certaines, telles que iframe ou des scripts qui sont connus pour causer des problèmes de délivrabilité et ne sont pas autorisés par la majorité des clients email les plus populaires.
Utiliser les icônes
Les icônes vous permettent de placer plusieurs images (avec ou sans texte) les unes à côté des autres sans utiliser les blocs.
Certaines fonctions sont spécifiques aux icônes, par exemple :
- la taille de l'icône (16, 32, 64 et 128px)
- l'espacement (c'est-à-dire l'espacement entre les icônes de 0 à 20px)
- le remplissage des icônes (remplissage appliqué à chaque icône)
Utiliser le menu
La fonctionnalité « menu » vous permet de créer un « menu hamburger » sur mobile lorsque vous activez l'option « menu mobile » au bas de la liste d'options disponibles.
Contenu dynamique
Pour plus d'informations sur cette fonctionnalité, vous pouvez consulter notre article à ce sujet.
Compte à rebours
Pour plus d'informations sur cette fonctionnalité, vous pouvez consulter notre article à ce sujet.
Avoir un aperçu de votre design
En cliquant sur « Aperçu », vous pouvez voir comment le message que vous êtes en train de créer sera affiché dans votre navigateur et sur les appareils mobiles.
Si vous souhaitez utiliser notre option de prévisualisation email (cette option pourrait être active ou inactive dans votre univers), vous devez d'abord enregistrer votre design. Si l'option est présente dans votre univers, cliquez sur le bouton « Outils » (bouton bleu à droite, puis bouton de prévisualisation).
Le lien vous amènera à une page séparée qui n'est pas hébergée sur notre plateforme.
Quelques conseils et bonnes pratiques
-
Déplacer des éléments
Lorsque vous faites glisser des éléments de contenu dans un bloc, assurez-vous toujours de voir le texte « faites-le glisser ici » comme indiqué ci-dessous :
-
Annuler et refaire une action
Si vous souhaitez annuler et refaire une action, vous trouverez trois icônes dans le coin inférieur gauche de Message Builder dans le menu d'édition. Vous pouvez visualiser l’ensemble de l'historique en cliquant sur le bouton le plus à gauche. N'oubliez pas de toujours sauvegarder votre design au fur et à mesure.
-
Taille optimale de l'email
Pour une livraison optimale de vos emails, nous vous recommandons de ne pas dépasser 100 Ko. Plus votre email est léger, plus vos images s'afficheront facilement sur les téléphones, en particulier si la connexion de vos clients est mauvaise. Si votre email dépasse 100 Ko, il sera tronqué et vos utilisateurs ne pourront pas l'afficher complètement.
-
Taille de l'écran lors de l'utilisation de l'Email Builder
Lors de la création de vos emails dans Message Builder, nous vous conseillons d’utiliser un écran de bureau pour obtenir une taille d’écran optimale.