Utilisation de la syntaxe Liquid dans les modèles de courriel

Lorsque vous utilisez les modèles de courriel disponibles sur Auth0 Dashboard, vous avez la possibilité d’utiliser le langage de modèle Liquid pour sélectionner les données appropriées et formater vos courriels. Liquid est un langage de création de modèles open-source qui étend la fonctionnalité de HTML et que vous pouvez utiliser pour générer dynamiquement vos courriels afin d’y inclure diverses informations. Pour en savoir plus, veuillez consulter Liquid for Designers sur Github.

En utilisant Liquid, vous pouvez structurer le Subject de vos courriels pour afficher le nom de l’application approprié, plutôt que de coder en dur une valeur particulière :

We are {{application.name}}!

Le HTML avec la syntaxe Liquid est pris en charge dans tous les champs (sauf URL Lifetime) des modèles de courriel de vérification, de confirmation de changement de mot de passe et de compte bloqué. Pour plus d’informations sur les attributs de sortie pris en charge et leur utilisation, voir Personnaliser les modèles de courriel.

Il existe deux types de balisage dans Liquid : la sortie et la balise.

Balisage de sortie

Le balisage de sortie se résout en texte et est entouré de deux paires d’accolades correspondantes :

Hello {{ name }}!

Vous pouvez personnaliser davantage l’apparence de la sortie en utilisant des filtres, qui sont des méthodes simples. Par exemple, le filtre upcase convertira le texte transmis au filtre en majuscules :

Hello {{ name | upcase }}!

Plusieurs filtres sont séparés par | et sont traités de la gauche vers la droite, appliquant le filtre suivant au résultat du précédent. Le modèle affichera le résultat final.

Les filtres suivants sont pris en charge :

Filtre Description Exemple
append Ajouter une chaîne {{ 'foo' | append:'bar' }} #=> 'foobar'
capitalize Mettre en majuscule les mots de la phrase d’entrée {{ "my great title" | capitalize }} #=> My great title
date Reformater une date (syntax reference (référence sur la syntaxe))
default Renvoie la variable donnée sauf si elle est null ou la chaîne vide, quand il retournera la valeur donnée {{ undefined_variable | default: "Default value" }} #=> "Default value"
divided_by Division entière {{ 10 | divided_by:3 }} #=> 3
downcase Convertir une chaîne de caractères en minuscules, {{ "Parker Moore" | downcase }} #=> parker moore
escape HTML échappe une chaîne {{ "Avez-vous lu 'James & the Giant Peach'?" | escape }} #=> Avez-vous lu 'James & the Giant Peach'?
escape_once Renvoie une version HTML échappée sans affecter les entités échappées existantes {{ "1 < 2 & 3" | escape_once }} #=> 1 < 2 & 3
first Obtenir le premier élément du tableau passé
join Joindre des éléments du tableau avec un certain caractère entre eux
last Obtenir le dernier élément du tableau passé
map Mapper/collecter un tableau sur une propriété donnée
minus Soustraction {{ 4 | minus:2 }} #=> 2
modulo Reste {{ 3 | modulo:2 }} #=> 1
newline_to_br Remplacer chaque nouvelle ligne (\n) par une séparation HTML
plus Addition {{ '1' | plus:'1' }} #=> 2, {{ 1 | plus:1 }} #=> 2
prepend Préfixer une chaîne {{ 'bar' | prepend:'foo' }} #=> 'foobar'
remove Supprimer chaque occurrence {{ 'foobarfoobar' | remove:'foo' }} #=> 'barbar'
remove_first Supprimer la première occurrence {{ 'barbar' | remove_first:'bar' }} #=> 'bar'
replace Remplacer chaque occurrence {{ 'foofoo' | replace:'foo','bar' }} #=> 'barbar'
replace_first Remplacer la première occurrence {{ 'barbar' | replace_first:'bar','foo' }} #=> 'foobar'
round Arrondit l’entrée au nombre entier le plus proche ou au nombre spécifié de décimales {{ 4.5612 | round: 2 }} #=> 4.56
size Renvoie la taille d’un tableau ou d’une chaîne {{ "Ground control to Major Tom." | size }} #=> 28
sort Trier les éléments du tableau
split Diviser une chaîne sur un motif correspondant {{ "a~b" | split:"~" }} #=> ['a','b']
strip_html Supprimer HTML à partir de la chaîne {{ "How <em>are</em> you?" | strip_html }} #=> How are you?
strip_newlines Supprimer toutes les nouvelles lignes (\n) de la chaîne
times Multiplication {{ 5 | times:4 }} #=> 20
truncate Tronquer une chaîne jusqu’à x caractères. Accepte également un deuxième paramètre qui s’ajoutera à la chaîne {{ 'foobarfoobar' | truncate: 5, '.' }} #=> 'foob.'
truncatewords Tronquer une chaîne jusqu’à x mots.
upcase Convertir une chaîne saisie en majuscule {{ "Parker Moore" | upcase }} #=> PARKER MOORE

Marquage de balises

Le marquage des balises ne se résout pas en texte et est entouré par une paires d’accolades correspondantes et de signes de pourcentages :

{% this does not resolve to text %}

Les balises sont généralement utilisées pour appliquer une logique à votre modèle. En utilisant les balises prises en chargepar Liquid, vous pouvez faire en sorte qu’un modèle réponde à plusieurs besoins.

Vous pouvez utiliser des balises pour exécuter des instructions if / else afin qu’un modèle unique envoie des courriels dans plusieurs langues.

Par exemple :

{% if user.user_metadata.lang == 'en' %} [email body in English] {% elsif user.user_metadata.lang == 'de' %} [email body in German] {% endif %}

Si vous avez besoin d’utiliser des conditions supplémentaires, envisagez d’utiliser une instruction case. Pour en savoir plus sur les instructions case, veuillez consulter Liquid pour Designers sur Github.

Commentaires sur les balises

Tout contenu entre les balises {% comment %} et {% endcomment %} ne sera pas affiché.

This will be seen. {% comment %} This will not be seen. {% endcomment %}

Balise brute

Pour désactiver temporairement le traitement du balisage Liquid, utilisez {% raw %} et {% endraw %}. Ceci est utile si vous utilisez une syntaxe qui entre en conflit avec Liquid.

Par exemple, vous pouvez échapper la ligne Mustache.js suivante de la façon ci-après :

{% raw %} var clients = "Clients:<ul>{{#client}}<li>{{fn}} {{ln}}" + {{phone}}</li>{{/client}}</ul>"; {% endraw %}

Déboguer les variables

Pour vous aider dans le développement de vos modèles, nous avons ajouté une balise {% debug %} Liquid personnalisée qui affiche un résumé des variables de modèle disponibles pour votre modèle lors de son rendu. N’oubliez pas de supprimer cette balise de tous les modèles en « direct ».

En savoir plus