Passer au contenu principal

Contenu email dynamique avec Liquid

Découvrez comment personnaliser vos emails avec du contenu dynamique grâce à Liquid.

Écrit par Clare Atreo

Personnaliser vos emails avec les balises de fusion

Les modèles d'emails Qomon utilisent Liquid, un langage de template qui permet d'insérer du contenu dynamique dans vos emails. Les balises de fusion sont des variables que Qomon remplace par des données réelles à l'envoi - prénoms des contacts, détails d'une action, titre d'une pétition, lien de désinscription, et plus encore.

Les données disponibles dans votre modèle dépendent du contexte d'utilisation :

  • Campagnes email : données de contact uniquement (contact.firstname, contact.surname, contact.mail).

  • Emails dans les Action Flows : données de contact complètes, ainsi que les données d'action, de pétition et de formulaire en ligne.

Comment fonctionne Liquid

Liquid utilise deux syntaxes principales :

Syntaxe

Rôle

Exemple

{{ variable }}

Afficher une valeur

{{ contact.firstname }}

{% tag %}

Logique (conditions, boucles)

{% if contact.mail %}…{% endif %}

Vous pouvez aussi appliquer des filtres pour transformer des valeurs :

{{ contact.firstname | default: "ami" }}

Note - Qomon utilise Liquid open-source, et non les thèmes Shopify. La référence Shopify Liquid couvre la même syntaxe de base, mais inclut des objets propres à Shopify (product, cart, etc.) qui n'existent pas dans Qomon. Utilisez la documentation Liquid open-source comme référence.

Trouver les balises dans Qomon

Pour accéder aux balises disponibles, rendez-vous dans le panneau Balises de fusion de l'aperçu email :

  1. Ouvrez une campagne email ou un email d'Action Flow, puis cliquez sur "Ouvrir les balises de fusion".

  2. Dans la barre latérale, ajoutez une Source de données (par exemple, un contact ou un événement).

  3. Développez Balises de fusion pour voir toutes les clés disponibles avec un exemple de valeur.

  4. Cliquez sur une clé pour la copier directement, par ex. {{ contact.firstname }}.

Copiez toujours les clés depuis ce panneau - les noms et préfixes correspondent exactement à ce qu'attend le moteur de rendu.

Les espaces de noms

Les balises sont regroupées par espace de noms (un préfixe avant le nom du champ).

Champs contact (contact.*)

Balise

Description

{{ contact.firstname }}

Prénom

{{ contact.surname }}

Nom

{{ contact.mail }}

Adresse email

{{ contact.mobile }}

Téléphone mobile

{{ contact.membership_code }}

Code d'adhésion

{{ contact.last_membership_end_date }}

Date de fin d'adhésion

Champs action (action.*)

Disponibles dans les emails d'Action Flow liés à une action.

Balise

Description

{{ action.name }}

Nom de l'action

{{ action.start }}

Date/heure de début (brut)

{{ action.end }}

Date/heure de fin (brut)

{{ action.link }}

Lien public

{{ action.registration_link }}

Lien d'inscription

{{ action.broadcast_link }}

Lien de diffusion en direct

{{ action.hide_broadcast_link }}

Lien de diffusion masqué ? (true/false)

Clés d'action sans préfixe

Ces clés pré-formatées sont prêtes à l'emploi dans les emails. Elles n'utilisent pas le préfixe action. :

Balise

Description

{{ display_date_range }}

Plage de dates (format localisé)

{{ display_time_range }}

Plage horaire (format localisé)

{{ display_pitch }}

Description de l'action (formatée)

{{ lineAddress1 }}

Rue et numéro

{{ lineAddress2 }}

Ville et code postal

{{ lineAddress3 }}

Pays

{{ lineAddressInfo }}

Infos complémentaires (bâtiment, salle, etc.)

Préférez ces clés à action.start / action.end / action.pitch - elles gèrent automatiquement la locale et le fuseau horaire.

Champs pétition et formulaire en ligne (site.*)

Balise

Description

{{ site.title }}

Titre de la page

{{ site.author }}

Nom de l'auteur

{{ site.redirect_url }}

URL de redirection après soumission

{{ site.end_date }}

Date de fin

Utilisez {{ site.title }} et non {{ petition.title }} - l'espace de noms petition.* n'existe pas.

Balises spéciales

Balise

Description

{{ unsubscribe }}

Lien de désinscription - obligatoire dans tous les emails en masse

{{ view }}

Lien "Voir dans le navigateur"

<a href="{{ unsubscribe }}">Se désinscrire</a>
<a href="{{ view }}">Voir cet email dans votre navigateur</a>

Gérer les données manquantes

Les profils contacts sont souvent incomplets. Anticipez toujours les champs vides.

Utilisez le filtre default pour les champs texte optionnels :

Bonjour {{ contact.firstname | default: "ami" }},

Utilisez {% if %} pour masquer un bloc entier si un champ est absent :

{% if contact.mobile %}
  Appelez-nous : {{ contact.mobile }}
{% endif %}

Utilisez {% unless %} pour la condition inverse :

{% unless action.hide_broadcast_link %}
  <a href="{{ action.broadcast_link }}">Regarder en direct</a>
{% endunless %}

Valeurs fausses en Liquid : Seuls nil et false sont faux. Les chaînes vides ("") et 0 sont vraies - utilisez le filtre default plutôt que {% if %} seul pour les champs texte.

Les clés d'adresse (lineAddress1, etc.) sont absentes du contexte lorsqu'aucune adresse n'est renseignée. Entourez-les toujours d'une condition :

{% if lineAddress1 %}
  {{ lineAddress1 }}<br>
{% endif %}

Exemple : email d'invitation à un événement

<h2>Vous êtes invité(e) : {{ action.name }}</h2>

<p>{{ display_pitch }}</p>

<p>
  <strong>Quand :</strong><br>
  {{ display_date_range }}<br>
  {{ display_time_range }}
</p>

{% if lineAddress1 %}
<p>
  <strong>Où :</strong><br>
  {{ lineAddress1 }}<br>
  {% if lineAddress2 %}{{ lineAddress2 }}<br>{% endif %}
  {% if lineAddress3 %}{{ lineAddress3 }}<br>{% endif %}
</p>
{% endif %}

<p><a href="{{ action.registration_link }}">S'inscrire</a></p>

<a href="{{ unsubscribe }}">Se désinscrire</a>

Erreurs fréquentes

❌ Incorrect

✅ Correct

{{ petition.title }}

{{ site.title }}

{{ action.display_date_range }}

{{ display_date_range }}

{{ contact.first_name }}

{{ contact.firstname }}

Pour aller plus loin

Des questions ? Contactez notre équipe via le chat en direct !

Avez-vous trouvé la réponse à votre question ?