Transformez une réponse simple en quelque chose de cliquable
Les messages enrichis sont des composants interactifs que vous insérez dans un message avec un shortcode. Votre interlocuteur voit une carte, un ensemble de boutons ou un petit formulaire, le remplit, et sa réponse est enregistrée dans la conversation.
Taper une liste d'options en espérant que quelqu'un réponde avec les bons mots crée du travail pour vous deux. Les messages enrichis leur donnent quelque chose à cliquer à la place, ce qui est utile pour les choix, les fiches produits, les coordonnées, les tableaux de prix et les vidéos.
Pas à pas
Rédigez un message et ajoutez un shortcode
Les messages enrichis sont insérés avec des shortcodes dans l'éditeur de texte du panneau. Tapez ou collez le shortcode souhaité, par exemple [buttons options="A,B,C"], et envoyez le message normalement. Votre interlocuteur voit le composant rendu plutôt que le texte du shortcode.
Remplissez les paramètres
Chaque shortcode accepte ses propres paramètres. Une fiche produit ressemble à [card image="URL" header="TITRE" description="..." link="URL" link-text="Acheter" extra="599€" target="_blank"], tandis qu'une vidéo est [video type="youtube" id="ID_VIDEO" height="350"] et accepte youtube ou vimeo.
Ajoutez les paramètres globaux si nécessaire
Chaque message enrichi accepte également id, title, message, success et settings. Utilisez title et message pour présenter le composant, et success pour ce qui est affiché une fois que la personne a répondu.
Échappez les caractères problématiques
Les virgules, les deux-points et les guillemets ont une signification dans un shortcode, alors échappez-les dans votre texte avec un antislash : \, pour une virgule, \: pour un deux-points et \" pour un guillemet. Omettre cette étape est la raison la plus courante pour laquelle un message enrichi s'affiche en morceaux.
Traduisez le texte si vous servez plusieurs langues
Le texte original d'un message enrichi doit être en anglais. Ajoutez la chaîne anglaise et sa traduction dans Paramètres > Traductions > Front End.
Créez un message personnalisé lorsque les shortcodes ne suffisent pas.
Les messages enrichis statiques créés à partir de votre propre HTML se configurent dans Paramètres > Divers. Les classes utiles sont sb-rich-btn sb-btn pour un bouton lien, sb-rich-btn sb-btn-text pour un lien texte, et sb-image pour permettre aux utilisateurs d'agrandir une image en cliquant.
Référence des paramètres
| Paramètre | Ce qu'il fait |
|---|---|
| [card] | Une carte de type produit avec une image, un en-tête, une description, un prix ou un texte supplémentaire, et un bouton lien. |
| [slider] et [slider-images] | Un ensemble de cartes défilables, jusqu'à 10 diapositives, ou un simple curseur d'images écrit comme [slider-images images="URL,URL,URL"]. |
| [chips] | Petits boutons d'option tactiles, écrits comme [chips options="A,B,C"]. |
| [buttons] | Un ensemble de boutons de réponse, écrits comme [buttons options="A,B,C"]. |
| [select] | Une liste déroulante d'options, écrite comme [select options="A,B,C"]. |
| [inputs] | Un petit formulaire de champs de texte avec un bouton d'envoi, écrit comme [inputs values="A,B,C" button="Envoyer maintenant"]. |
| [email] | Recueille les coordonnées, par exemple [email name="true" last-name="true" phone="true" phone-required="false" placeholder=""]. |
| [timetable] | Affiche vos horaires d'ouverture sous forme de composant dans le message. |
| [articles] | Affiche des articles dans le message, rédigés sous la forme [articles link="..."]. |
| [list] et [list-image] | Une liste simple, numérotée, à deux colonnes ou avec images, par exemple [list values="A,B,- C,- D,E" numeric="true"] ou [list-image values="URL:A,URL:B"]. |
| [table] | Un tableau de données, rédigé sous la forme [table header="A,B,C" values="A:B:C,A:B:C"]. |
| [button], [image] et [share] | Un bouton lien unique, une image via [image url="..."], ou des icônes de partage social via [share fb="" tw="" li="" pi="" wa=""]. |
Bon à savoir
Le HTML brut est bloqué dans les messages normaux
Pour des raisons de sécurité, le HTML brut et JavaScript ne sont pas autorisés dans les messages ordinaires. Si vous avez besoin de votre propre balisage, créez un message riche personnalisé dans Paramètres > Divers.
Les éléments de liste imbriqués nécessitent un tiret
Dans [list], préfixez une entrée par un tiret et un espace pour en faire un élément interne, comme dans [list values="A,B,- C,- D,E"]. Pour une liste à deux colonnes avec titres, utilisez des deux-points : [list values="A:X,B:Y,C:Z"].
Les boutons peuvent ouvrir un article
Un bouton s'écrit [button link="..." name="Cliquez ici" target="_blank" style="link"]. Pour ouvrir l'un de vos articles, utilisez #article-ID comme valeur du lien.
Rendre les coordonnées obligatoires sur les applications de messagerie
Ajoutez required-messaging-apps="true" au shortcode [email] pour exiger également l'e-mail ou le numéro de téléphone sur les applications de messagerie.
Mise en forme et liens dans l'éditeur
L'éditeur comprend *gras*, __italique__, ~barré~, `code` et ```bloc de code```. Les liens sont automatiquement transformés en liens ; pour leur donner un nom, ajoutez #sb-exemple à la fin, les espaces étant remplacés par des doubles tirets.
Les sauts de ligne ne sont pas la touche Entrée
Appuyer sur Entrée envoie le message. Utilisez MAJ+ENTRÉE ou CTRL+ENTRÉE pour ajouter un saut de ligne à l'intérieur d'un message.
Questions fréquentes
Où taper un message enrichi ?
Que se passe-t-il avec ce que quelqu'un sélectionne ou tape ?
Pourquoi ma carte est-elle apparue cassée au milieu d'une phrase ?
Combien de diapositives un carrousel peut-il contenir ?
Les messages enrichis peuvent-ils apparaître dans d'autres langues ?
Et si j'ai besoin d'un composant que vous ne proposez pas ?
Prêt à mettre fin au chaos ?
Unifiez vos messages, automatisez les questions récurrentes et transformez les conversations en revenus — dès aujourd'hui.
Commencer