Utiliser Twig pour personnaliser le contenu Wallet

Twig est un langage de template qui vous permet de personnaliser et d'afficher dynamiquement du contenu sur vos cartes Wallet et vos notifications. Vous pouvez utiliser Twig pour afficher des informations spécifiques à l'utilisateur, formater des données et créer du contenu conditionnel.

❓ Qu'est-ce que Twig ?

Twig est un moteur de template flexible qui vous permet d'insérer du contenu dynamique dans vos cartes Wallet en utilisant des variables et des filtres. Avec Twig, vous pouvez afficher des informations personnalisées comme les noms, les dates, les montants et le statut de fidélité.

Avant de commencer

✅ Bonnes pratiques

  • Testez toujours le code Twig avec vos données réelles avant de le déployer en production.
  • Utilisez le filtre |raw lors de l'affichage de texte avec des accents pour éviter les problèmes d'encodage.
  • Gardez les expressions Twig simples et lisibles pour une maintenance plus facile.

🔡 Limites de caractères

Les notifications ont une limite de 255 caractères. Simplifiez votre code Twig autant que possible pour rester dans cette limite.

🧪 Testez votre code Twig

Utilisez le Twig playground pour tester votre code avant de l'implémenter.

📄 Documentation complète

Pour les fonctionnalités avancées de Twig, consultez la documentation complète sur https://twig.symfony.com.

🤖 Utiliser Twig avec ChatGPT

Vous pouvez utiliser ChatGPT pour générer du code Twig en fournissant ce prompt :

You are a Twig template generator.
I will describe a business requirement in plain language.
Your task is to translate it into valid, clean Twig code.

Rules:
- Output ONLY Twig code
- Do not add explanations or comments
- Use standard Twig syntax
- Assume variables already exist
- Keep the code simple and readable

Business requirement:
[DESCRIBE YOUR NEED HERE]

</> Syntaxe de base de Twig

Twig utilise des doubles accolades pour afficher des variables. Par exemple, pour afficher le prénom de votre utilisateur, vous devez utiliser :

{{user.firstname}}

Découvrez la syntaxe de base de Twig pour commencer :

👤 Afficher les informations utilisateur

Afficher le prénom

Entrée

Sortie

{{user.firstname}}

Antoine

Afficher le nom de famille

Entrée

Sortie

{{user.lastname}}

Dupont

Afficher le statut de fidélité

Entrée

Sortie

{{status.name}}

Gold

Afficher le solde de l'utilisateur

Entrée

Sortie

{{user.balance}}

1,500

🔡 Formater les noms avec majuscules

Afficher le prénom avec majuscule et accents

Éviter les problèmes d'affichage des accents

Entrée

Sortie

{{user.firstname|raw}}

jérémy

Afficher le prénom avec une majuscule et les accents appropriés

Entrée

Sortie

{{user.firstname|lower|capitalize|raw}}

Jérémy

Afficher le nom de famille en majuscules

Entrée

Sortie

{{user.lastname|upper}}

DUPONT

Afficher le prénom avec uniquement la première lettre en majuscule

Entrée

Sortie

{{user.firstname|capitalize}}

Antoine

^ Gérer les problèmes d'encodage des accents

Si les données clients ne sont pas correctement encodées dans votre base de données, utilisez le filtre replace pour corriger les caractères spéciaux :

Entrée

Sortie

{{user.lastname|replace({'ó': 'ó', 'ñ': 'ñ', 'í': 'í', 'é': 'é'})}}

Picó Nuñez Pérez

📆 Formater les dates

Afficher la date au format JJ/MM/AAAA

Entrée

Sortie

{{user.cardExpiration|date('d/m/Y')}}

08/11/2026

Afficher la date au format JJ/MM/AA

Entrée

Sortie

{{user.cardExpiration|date('d/m/y')}}

08/11/26

🔢 Formater les montants et les nombres

Afficher le montant avec virgule et 2 décimales

Entrée

Sortie

{{user.balance|number_format(2, ',', '.')}} €

1,55 €

Effectuer des calculs sur les montants

Effectuer des calculs comme la soustraction, l'addition, la multiplication ou la division

Entrée

Sortie

{{(1000 - counters.cashback.value)|number_format(2, '.', ',')}}

36.999999990 > 36.99

🏬 Afficher les informations du magasin

Les informations du magasin doivent être préalablement chargées dans la bibliothèque.

Entrée

Sortie

{{store.name}}
{{store.address1}} 
{{store.postal_code}}, {{store.city}}
{{store.phone}}

My Super Store
116 Hope Street
99123, Hills
+1 333 0129

Afficher les horaires d'ouverture

Entrée

Sortie

MONDAY TO SATURDAY: {{store.opening_hours.monday}}
SUNDAY: {{store.opening_hours.sunday}}

MONDAY TO SATURDAY: 9am - 7pm
SUNDAY: 10am - 8pm

🫆 Créer du contenu conditionnel

Afficher le contenu en fonction du genre

Entrée

Sortie

{% if user.civility == 1%}M.{%else%}Mme{% endif %} {{user.lastname}}

M. Antoine Dupont
Mme Laura Dupont

Afficher le contenu lorsque le prénom est manquant

Si le client n'a pas de prénom disponible

Entrée

Sortie

{% if user.firstname == NULL%}CLIENT{%else%}{{user.firstname}}{% endif %}

Cher CLIENT

Afficher le contenu en fonction de deux conditions

{% if user.packCycle == '0' and user.packSki == '0' %} Votre contenu ici {% endif %}

Afficher le contenu en fonction de l'identifiant du magasin

Afficher le nom du magasin uniquement si « FR » est présent dans son identifiant

{% if 'FR' in store.identifier %} • {{store.name}} {% endif %}

Afficher le contenu en fonction d'une liste de valeurs

{% if store.identifier in ['PSCES066', 'PSCES065', 'PSCES067'] %} Ce texte si l'ID du magasin est dans la liste {% else %} Ce texte si l'ID du magasin n'est PAS dans la liste {% endif %}

💲 Afficher les informations de l'offre dans les notifications

Pour afficher les valeurs d'offre dans les notifications (maximum 255 caractères) :

{{user.firstname}}, En récompense de vos achats, vous avez un bon de {% for o in offers.all %}{{o.amount}}€. Valable sur tout achat jusqu'au {{o.expiration_date|date("d/m/y")}}.{% endfor %}

Si vous ciblez uniquement les utilisateurs avec des offres, vous pouvez simplifier :

{{user.firstname}}, En cadeau vous disposez maintenant d'un bon de {% for o in offers.all %}{{o.amount}}€ valable jusqu'au {{o.expiration_date|date("d/m/y")}}.{% endfor %}

Vérifier si des offres existent

{% if offers.all is null %}
{% else %}
Mes offres
{% for o in offers.all %}
• Valable à partir du {{o.starts_at|date('d-m-Y')}} et code {{o.code}} 
{% endfor %}
{% endif %}

🔀 Remplacer ou supprimer du texte d'une valeur

Supprimer un texte spécifique

Afficher uniquement 123456 à partir de CT123456

Entrée

Sortie

{{user.barcode|replace({"CT": ""})}}

123456

Remplacer le texte à plusieurs emplacements

Remplacer « bla » par rien dans bla123bla456bla

Entrée

Sortie

{{user.barcode|replace({"CT": ""})}}

123456

🖖 Diviser un texte long et ne garder qu'une partie

Ne garder que la première phrase

Afficher uniquement la première phrase d'une longue description. Cela divise le texte au premier point et affiche uniquement la première partie.

{{offer.description|split('.')|first}}

Ne garder qu'une partie en utilisant un mot-clé spécifique

Si vous recevez du texte avec « RDV » comme séparateur :

{{offer.description|split('RDV')|first}}

🪡 Extraire des caractères spécifiques d'une variable

Si user.locale = en_FR (format langue_Pays), alors :

Extraire uniquement le pays (2 derniers caractères)

Entrée

Sortie

{{user.locale|slice(-2)}}

FR

Extraire uniquement la langue (2 premiers caractères)

Entrée

Sortie

{{user.locale|slice(0,2)}}

en

🔗 Encoder les données en URL

Pour encoder les données en URL

{{user.data|url_encode}}

🟢 Créer des liens WhatsApp

<a href="whatsapp://send?phone=34671015121&text=Hello">671015121</a>