Modification des formats de texte brut, HTML et d'email mobile

Le Concepteur d'emails permet de modifier différents rendus d'emails. Il permet de générer une version textuelle de votre email, de modifier la source HTML d'un email et de concevoir des emails visualisables sur les appareils mobiles.

Générer une version texte de l'email

Par défaut, la version Texte simple de votre email est automatiquement générée et synchronisée avec la version Edition.

Les champs de personnalisation et les blocs de contenu ajoutés à la version HTML sont également synchronisés avec la version en texte brut.

Remarque

Pour utiliser des blocs de contenu dans la version en texte brut, assurez-vous qu'ils ne contiennent pas de code HTML.

Pour disposer d'une version en texte brut différente de la version HTML, vous pouvez désactiver cette synchronisation en cliquant sur le sélecteur Synchroniser avec le code HTML dans la vue Texte brut de votre email.

Vous pouvez ensuite éditer la version en texte brut comme vous le souhaitez.

Remarque

Si vous éditez la version Texte brut alors que la synchronisation est désactivée, la prochaine fois que vous activerez l'option Synchroniser avec le code HTML, toutes les modifications que vous avez apportées à la version en texte brut seront remplacées par la version HTML. Les modifications effectuées dans la vue Texte brut ne peuvent pas être reflétées dans la vue HTML.

Editer la source de contenu en HTML d'un email

Pour les utilisateurs les plus expérimentés et pour des raisons de débogage, vous pouvez afficher et éditer le contenu de l'email directement dans la version HTML.

Vous pouvez éditer la version HTML de l'email de deux façons différentes :

  • Sélectionnez Edition > HTML pour ouvrir la version HTML de l'ensemble de l'email.

  • Dans l'interface WYSIWYG, sélectionnez un élément et cliquez sur l'icône Code source.

    Seule la source de l'élément sélectionné s'affiche. Vous pouvez éditer le code source si l'élément sélectionné est un composant de contenu HTML. D'autres composants sont en lecture seule, mais peuvent toujours être édités dans la version HTML complète de l'email.

Si vous modifiez le code HTML, la réactivité de l'email peut être altérée. Veillez à le tester à l'aide du bouton Prévisualiser. Voir Prévisualiser le message.

Conception d'emails pour le rendu sur appareils mobiles

Vous pouvez affiner le responsive design d'un email en éditant séparément toutes les options de style pour l'affichage mobile. Par exemple, vous pouvez adapter les marges et la marge intérieure, utiliser des polices de plus grande ou plus petite taille, modifier les boutons ou appliquer différentes couleurs de fond qui seront spécifiques à la version mobile de votre email.

Toutes les options de style sont disponibles dans la vue mobile. Les paramètres de style du Concepteur d'email sont présentés plus haut sur cette page.

  1. Créez un email et commencez à éditer le contenu. Voir à ce propos la section Concevoir entièrement un contenu d'email.

  2. Pour accéder à la vue mobile dédiée, cliquez sur le bouton Passer en vue Mobile.

    La version mobile de l'email s'affiche. Elle contient tous les composants et styles définis dans la vue de poste de travail.

  3. Editez indépendamment tous les paramètres de style tels que la couleur de fond, l'alignement, la marge intérieure, la marge, la famille de polices, la couleur du texte, etc.

  4. Lorsque vous éditez un paramètre de style dans la vue mobile, les modifications ne s'appliquent qu'à l'affichage mobile.

    Par exemple, réduisez la taille d'une image, ajoutez un fond vert et modifiez la marge intérieure dans la vue mobile.

  5. Vous pouvez masquer un composant lorsqu'il est affiché sur un appareil mobile. Pour cela, sélectionnez Afficher uniquement sur les postes de travail dans les Options d'affichage.

    Vous pouvez également choisir de masquer ce composant sur les postes de travail. Il ne s'affichera donc plus que sur les appareils mobiles. Pour cela, sélectionnez Afficher uniquement sur les appareils mobiles.

    Par exemple, cette option vous permet d'afficher une image spécifique sur les appareils mobiles et une autre image sur les postes de travail.

    Vous pouvez définir cette option à partir de la vue mobile ou de poste de travail.

  6. Cliquez de nouveau sur le bouton Passer en vue Mobile pour retourner à la vue de poste de travail standard. Les changements de style que vous venez d'effectuer ne sont pas pris en compte.

    Remarque

    La seule exception concerne les paramètres de style intégré. Toute modification des paramètres de style intégré est également appliquée à la vue de poste de travail standard.

  7. Toute autre modification apportée à la structure ou au contenu de l'email, telle que des modifications de texte, le téléchargement d'une nouvelle image, l'ajout d'un nouveau composant, etc. est également appliquée à la vue standard.

    Par exemple, passez en vue mobile, modifiez du texte et remplacez une image.

  8. Cliquez de nouveau sur le bouton Passer en vue Mobile pour retourner à la vue de poste de travail standard. Les modifications sont prises en compte.

  9. La suppression d'un style dans la vue mobile vous ramène au style appliqué en mode de poste de travail.

    Par exemple, dans la vue mobile, appliquez une couleur de fond verte à un bouton.

  10. Passez en vue de poste de travail et appliquez un fond gris au même bouton.

  11. Passez de nouveau en vue mobile, puis désactivez le paramètre Couleur de fond.

    La couleur de fond définie dans la vue de poste de travail est maintenant appliquée : elle devient grise (non vide).

    La seule exception concerne le paramètre Couleur de bordure. Lorsqu'il est désactivé dans la vue mobile, aucune bordure n'est plus appliquée, même si une couleur de bordure est définie dans la vue de poste de travail.

Remarque

La vue mobile n'est pas disponible dans les fragments.

Sur cette page