Votre compte envoie régulièrement des notifications par e-mail aux utilisateurs finaux quand des événements (mises à jour des tickets ou du centre d’aide, par exemple) ont lieu. Le contenu et le format de quasiment tous ces e-mails sont contrôlés par deux modèles dans le Centre d’administration : un modèle HTML et un modèle texte brut. Les deux formats sont inclus dans chaque e-mail envoyé. La version affichée aux utilisateurs finaux dépend des paramètres de leur application de messagerie.
Vous pouvez utiliser les deux modèles tels quels ou les modifier en fonction de vos besoins spécifiques. Contrairement au modèle texte brut, le modèle HTML vous permet de personnaliser l’aspect des e-mails envoyés depuis votre compte. Par exemple, vous pouvez ajouter le logo de votre entreprise ou une bannière d’appel à l’action afin que vos e-mails reflètent l’identité de votre marque ou l’aspect de votre centre d’aide.
Limites
- La modification des modèles d’e-mail n’est pas autorisée par défaut pour les comptes d’essai. Il est aussi possible qu’elle ne soit pas autorisée pour tous les comptes. Pour activer la modification, contactez l’assistance client Zendesk en spécifiant votre sous-domaine, un lien vers le site Web de votre entreprise et une courte description des modifications que vous voulez effectuer.
- Les notifications pour les conversations annexes via e-mail n’utilisent pas les modèles d’e-mail.
Anatomie des modèles d’e-mail
Il est utile de comprendre l’anatomie des modèles HTML et texte brut pour les personnaliser.
Anatomie du modèle HTML
L’e-mail de notification HTML standard envoyé depuis votre compte Zendesk ressemble à ce qui suit :
Les numéros sur le côté de la capture d’écran correspondent aux composants des modèles d’e-mail suivants :
Corps de l’e-mail |
Le corps de l’e-mail est représenté par la balise Avant d’envoyer l’e-mail, le système remplace la balise Le corps de l’e-mail lui-même est défini dans un déclencheur. Dans l’action de déclencheur suivante, le corps de l’e-mail est mis en surbrillance rouge : Dans cet exemple, le corps de l’e-mail est composé de deux éléments :
Consultez Personnalisation de vos e-mails dans les déclencheurs et les automatismes. |
Pied de page standard |
Le pied de page standard se compose des deux balises suivantes :
Ces deux balises sont facultatives. Vous pouvez les supprimer du modèle. |
Anatomie du modèle texte brut
Le modèle d’e-mail au format texte brut est utilisé lorsque l’utilisateur choisit de ne pas lire ses messages au format HTML. Le modèle se compose de deux balises système :
{{content}} {{footer}}
La balise {{content}}
insère le texte généré par les règles de gestion (déclencheurs, automatismes ou macros) et les commentaires du ticket. La balise {{footer}}
est facultative. Vous pouvez la supprimer si vous le souhaitez. Pour en savoir plus, consultez Balises système.
Si vous souhaitez ajouter une ligne à vos e-mails en texte brut, ajoutez-la dans le modèle.
Thanks for contacting Mondocam Support! {{content}} {{footer}}
Personnalisation de vos e-mails HTML
Vous pouvez personnaliser l’aspect des notifications par e-mail HTML envoyées à vos clients. Cette section aborde les sujets suivants :
- Modification du modèle d’e-mail HTML
- Exemple : modification de la couleur du texte du pied de page
- Exemple : ajout de votre logo
Si vous avez besoin de directives ou de recettes, consultez le Guide de design des e-mails Zendesk.
Modification du modèle d’e-mail HTML
Vous pouvez modifier l’aspect des e-mails HTML en modifiant le modèle d’e-mail HTML du Centre d’administration. Pour modifier le modèle HTML, vous devez un certain niveau de connaissances HTML et CSS. Si vous avez besoin de recettes, consultez le Guide de design des e-mails Zendesk. Si vous avez besoin de directives et conseils de design, consultez Directives et conseils pour les e-mails HTML.
Les modifications sont appliquées à vos e-mails sortants dès leur enregistrement. Il est donc conseillé de vérifier et tester vos modifications avant de les appliquer au modèle. Avec l’édition Entreprise, vous pouvez aussi tester les modifications apportées aux e-mails dans une sandbox avant de les déployer publiquement.
Pour modifier le modèle HTML
-
Dans le Centre d’administration, cliquez sur
Canaux dans la barre latérale, puis sélectionnez Talk et e-mail > E-mail.
Si vous utilisez l’édition Enterprise, continuez en cliquant sur Gérez les paramètres > Modèles.
- Faites défiler la page jusqu’à la case Modèle HTML.
- Modifiez le code HTML du modèle en fonction de vos besoins.
Consultez le Guide de design des e-mails Zendesk.
- Si vous souhaitez repartir à zéro avec la version par défaut, cliquez sur Rétablir la valeur par défaut sous le modèle.
- Dans la section Modèles d’e-mail, cliquez sur Afficher les photos de profil utilisateur dans les e-mails pour afficher les photos des profils d’utilisateur dans les e-mails.
Quand cette option est sélectionnée, les photos des profils s’affichent dans les e-mails quand le client de messagerie prend cette fonctionnalité en charge. Certains clients de messagerie n’affichent pas les images par défaut.
- Cliquez sur Enregistrer.
Exemple : modification de la couleur du texte du pied de page
Cet exemple montre comment changer la couleur de la police du pied de page afin d’utiliser le bleu sarcelle, dont le code hexadécimal est #009966. Pour aller plus loin, consultez les recettes suivantes pour les pieds de page dans le Guide de design des e-mails Zendesk :
- Recette : ajout d’un pied de page
- Recette : ajout de liens vers les réseaux sociaux dans le pied de page
Supposez que le pied de page de votre modèle se compose des balises {{footer}}
et {{footer_link}}
. Si votre entreprise s’appelle Mondocam, les balises rendent la ligne suivante dans l’e-mail envoyé : « Cet e-mail est un service de MondoCam. En partenariat avec Zendesk. ».
- Dans le Centre d’administration, cliquez sur
Canaux dans la barre latérale, puis sélectionnez Talk et e-mail > E-mail.
- Dans la section Modèles d’e-mail, recherchez les deux balises du pied de page et leur balise
<div>
mère :... <div style="padding: 10px; line-height: 1.5; font-family: 'Lucida Grande',Verdana,Arial,sans-serif; font-size: 12px; color: #aaaaaa; margin: 10px 0 14px 0; padding-top: 10px; border-top: 1px solid #eeeeee;"> {{footer}} {{footer_link}} </div> ...
- Remplacez la valeur de
color
par #009966, code hexadécimal du bleu sarcelle - Cliquez sur Enregistrer.
:hover
. Exemple : a:hover
{color:#FF00FF;}
. Malheureusement, les pseudo-classes CSS ne sont pas prises en charge en CSS incorporé et les principaux clients de messagerie comme Gmail retirent tout code CSS qui n’est pas incorporé.
Quand vous modifiez la couleur du texte, choisissez un contraste suffisant à des fins d’accessibilité. Suivez les recommandations des directives pour l’accessibilité du contenu Web (Web Content Accessibility Guidelines, WCAG) et utilisez des outils comme WebAIM color contrast checker pour vérifier le rapport de contraste entre le texte et l’arrière-plan.
Exemple : ajout de votre logo
Vous pouvez ajouter le logo de votre entreprise en haut de vos notifications par e-mail, mais n’oubliez pas que certains clients de messagerie n’affichent pas les images par défaut.
Pour ajouter le logo de votre entreprise à vos notifications par e-mail
- Insérez une balise
<img>
(<img src="">
) après la balise<body>
mais avant la balise de contenu<div>
. - Spécifiez l’URL de l’image du logo comme valeur de l’attribut
src
. Exemple :<img src="https://mondocam.com/assets/logo.png"/>
- Si vous souhaitez ajouter un hyperlien au logo, placez la balise
<img>
dans une balise d’ancrage, comme dans l’exemple suivant :<a href="https://mondocam.com/home"><img src="https://mondocam.com/assets/logo.png"></a>
Pour personnaliser votre logo de façon plus détaillée, consultez Recette : ajout du logo de votre entreprise dans le Guide de design des e-mails Zendesk.
Personnalisation de vos e-mails en texte brut
Comme vous ne pouvez pas utiliser d’éléments HTML, vous ne pouvez pas personnaliser l’aspect des notifications par e-mail en texte brut envoyées à vos clients. Cependant, vous pouvez ajouter des informations à vos e-mails.
Pour personnaliser le modèle texte brut
- Dans le Centre d’administration, cliquez sur
Canaux dans la barre latérale, puis sélectionnez Talk et e-mail > E-mail.
- Allez à la section Modèles d’e-mail.
- Modifiez le modèle texte brut en fonction de vos besoins.
- Si vous souhaitez repartir à zéro avec la version par défaut, cliquez sur Rétablir la valeur par défaut sous le modèle.
- Cliquez sur Enregistrer.
Personnalisation de vos e-mails dans les déclencheurs et les automatismes
Les déclencheurs et les automatismes peuvent inclure des actions qui envoient des e-mails à vos utilisateurs. Vous pouvez ajouter des éléments HTML et Liquid aux actions des déclencheurs et des automatismes, plutôt qu’au modèle d’e-mail, pour personnaliser le corps du message. Exemple :
Personnalisation de vos e-mails pour plusieurs marques
Pour personnaliser les notifications par e-mail pour plusieurs marques, vous devez personnaliser le corps de l’e-mail dans les actions des déclencheurs et des automatismes, tout en gardant le modèle d’e-mail le plus générique possible, car vous n’en avez qu’un. En d’autres termes, vous utilisez un seul modèle pour plusieurs marques, mais personnalisez différentes actions pour chaque marque. Pour en savoir plus, consultez les ressources suivantes :
Balises pour le modèle d’e-mail HTML - Référence
La majeure partie du contenu des notifications par e-mail est générée dynamiquement par le système Zendesk. Ce contenu généré est représenté par des balises dans les modèles d’e-mail. Ces balises sont placées entre accolades doubles, par exemple {{footer}}
.
Les balises insèrent le contenu de l’e-mail et le texte du pied de page.
{{content}}
- Affiche le contenu de l’e-mail, qui peut comprendre des commentaires de tickets et des photos de profils utilisateur. Le contenu est défini dans le déclencheur, l’automatisme ou toute autre règle qui envoient l’e-mail depuis votre compte. Consultez Création et gestion des déclencheurs pour les mises à jour des tickets et les notifications.
{{quoted_content}}
- (facultatif) Affiche l’historique des messages. Le contenu cité entre guillemets est généralement réduit dans l’application de messagerie de l’utilisateur, mais il peut le développer. Dans Gmail par exemple, l’utilisateur clique sur les trois points (…). Consultez Threads d’e-mails simplifiés.
{{footer}}
- (facultatif) Affiche la ligne « Cet e-mail provient de NomdevotreZendesk. » Cette balise affiche également les propriétés du ticket, telles que l’état et le demandeur, dans les e-mails envoyés aux agents. En revanche, les propriétés ne figurent pas dans les e-mails envoyés aux utilisateurs finaux.
{{footer_link}}
- (facultatif) Affiche la ligne « Envoyé par Zendesk ». Le mot Zendesk est un lien vers https://www.zendesk.com.
{{delimiter}}
- Affiche la ligne « ##- SVP n’écrivez pas sous cette ligne -## ». Le système utilise le délimiteur pour séparer le texte d’origine du nouveau. Lorsqu’une personne répond à un e-mail, le nouveau texte de la réponse est ajouté au ticket sous forme de commentaire. Cette balise est obligatoire dans le modèle HTML si vous utilisez le délimiteur d’e-mail. Consultez Personnalisation du texte du délimiteur dans les e-mails.
{{styles}}
- (facultatif) Pour un usage futur. Actuellement, le système utilise cette balise pour inclure des styles quand il détecte une langue s’écrivant de droite à gauche.
{{attributes}}
- (facultatif) Pour un usage futur. Actuellement, le système utilise cette balise pour inclure des attributs quand il détecte une langue s’écrivant de droite à gauche.