Utiliser HTML avec l’éditeur d’e-mails

Avec l’Éditeur d’e-mail d’ActiveCampaign, vous pouvez facilement utiliser le HTML dans l’édition d’e-mails. Vous disposez ainsi de toute la souplesse nécessaire pour créer une campagne qui réponde au mieux à vos objectifs commerciaux et pour faciliter la résolution des problèmes. 

Remarque

•  Cet article fait référence à l’éditeur d’e-mail lancé en 2022. Si vous souhaitez apprendre à utiliser les options HTML pour le concepteur classique, veuillez consulter Concepteur classique : Utiliser le bloc de contenu HTML pour les campagnes
• Vous devez être à l’aise avec HTML et CSS pour utiliser cette option
• Notre équipe CX ne peut pas vous aider à créer ou à dépanner un code que vous créez dans l’éditeur d’e-mail
• Les ifr-frames ne sont pas prises en charge dans les campagnes d’e-mail

Pour ajouter le bloc de contenu HTML :

Une façon d’ajouter du HTML à votre campagne est d’utiliser le bloc de contenu HTML. Avec cette option, vous n’ajoutez que du code HTML au bloc de contenu. Elle ne s’applique pas aux autres blocs de contenu de l’éditeur d’e-mail. 

1. Dans l’éditeur d’e-mail, cliquez sur le menu déroulant "Blocks" dans le menu de droite.
2. Faites défiler jusqu’à l’option de bloc HTML.
3. Faites glisser le bloc de contenu « Produits » vers votre e-mail. Le bloc HTML s’affiche dans la fenêtre Éditeur d’e-mail.
4. Cliquez sur le bloc HTML pour faire apparaître l’éditeur de code.
5. Ajoutez votre HTML personnalisé dans l’éditeur de code.
6. Pour quitter l’éditeur de code, cliquez sur n’importe quel bloc dans l’Éditeur d’e-mail. 

Accéder à l’option code

Pour mieux contrôler l’éditeur d’e-mail, vous pouvez modifier le code HTML de votre e-mail à l’aide du bouton code.

1. Dans l’éditeur d’e-mail, cliquez sur le bouton "Code". Elle se trouve en haut de la page.
   
2. Le panneau de code se charge en bas de l’éditeur. Vous pouvez ici consulter le code de votre e-mail. Notez que l’éditeur de code affichera le HTML et le CSS pour tout bloc de contenu sur lequel vous cliquez. Si vous ne sélectionnez pas de bloc de contenu, l’éditeur affichera le code pour l’ensemble de l’e-mail.
3. Pour ajuster le code, cliquez sur la zone que vous souhaitez mettre à jour et ajoutez ou modifiez le code.
4. Pour quitter la vue du code, cliquez à nouveau sur le bouton du code.

Créer un nouveau modèle avec l’éditeur d’e-mail et un code personnalisé

Vous pouvez créer un modèle dans l’éditeur d’e-mail qui utilise un code personnalisé.

1. Sur la page Campagnes, cliquez sur « Modèles de campagne »
2. Cliquez sur le bouton « Créer un modèle ».
3. Cliquez sur l’option « Éditeur d’e-mail », puis cliquez sur « Continuer »
4. Sur la page suivante, cliquez sur l’option « Repartir de zéro ».
5. L’éditeur d’e-mail se charge. Cliquez sur le bouton « Terminé ».
   
6. Le panneau de code s’ouvre au bas de la page et affiche les codes HTML et CSS.
   • Ajouter ou modifier le HTML dans l’éditeur de code
     
   • Pour ajouter une feuille de style CSS personnalisée, cliquez sur « CSS » pour développer la boîte, puis ajoutez votre feuille de style CSS.
     
7. Lorsque vous avez terminé, cliquez sur le bouton « Code » pour visualiser votre travail. Vous pouvez également utiliser les options de glisser-déposer pour compléter votre e-mail (si nécessaire). 

Dépannage de la conception

Si un texte ou un bouton ne s’affiche pas correctement, vous pouvez afficher le code de l’e-mail et l’ajuster en cliquant sur le bouton « Code ». Le fait d’avoir facilement accès au code vous permet de résoudre les problèmes et de personnaliser le style de l’e-mail.

Veillez à ce que votre code HTML ne contienne pas les balises suivantes, car elles ne sont pas prises en charge par les clients de messagerie (tels que Gmail, Yahoo, etc.) :

• <button>
• <form>
• <input>
• <select>
• <textarea>
• <iframe>
• <script>
• <video>