Twig Template : C’est Quoi, Comment l’Utiliser ?

Vous en avez marre de mélanger votre code PHP et votre HTML dans les mêmes fichiers ? Ça devient vite illisible et difficile à maintenir, n’est-ce pas ? Vous cherchez une solution pour rendre vos vues plus propres, plus sécurisées et plus faciles à gérer pour un intégrateur ou un web designer ?

Twig est un moteur de template pour PHP qui répond exactement à ce problème. Son rôle est simple : séparer complètement la logique de votre application de la présentation. Cet article vous explique ce que c’est, comment ça marche et pourquoi vous devriez l’utiliser dans vos projets.

Qu’est-ce qu’un Template Engine comme Twig ?

Un template engine, ou moteur de template en français, est un outil qui permet de générer des fichiers texte, le plus souvent du HTML. Il part d’un fichier modèle, appelé « template », qui contient du balisage (comme du HTML) et des instructions spéciales propres au moteur.

Le moteur de template prend ce fichier, y injecte des données (variables, tableaux, objets) que vous lui fournissez depuis votre code PHP, et produit un fichier final. L’idée est de ne plus jamais écrire `` au milieu de votre HTML. À la place, vous utilisez une syntaxe plus simple et plus propre, comme `{{ variable }}`.

L’avantage principal de cette approche est la séparation des préoccupations. C’est un concept fondamental en développement. Le développeur back-end se concentre sur la récupération des données et la logique métier en PHP. De son côté, l’intégrateur ou le web designer travaille sur le template Twig, qui ressemble beaucoup à du HTML, sans risquer de casser la logique de l’application.

Cette séparation rend le code beaucoup plus simple à lire et à maintenir. Quand vous devez modifier le design, vous touchez aux fichiers `.twig`. Quand vous devez changer la façon dont les données sont calculées, vous touchez aux fichiers `.php`. Chacun reste à sa place, ce qui améliore la collaboration et la maintenabilité du projet sur le long terme.

Pourquoi Choisir Twig Plutôt que du PHP Brut ? Les 4 Avantages Clés

Utiliser du PHP directement dans le HTML fonctionne, mais cette approche montre vite ses limites. Twig a été créé pour corriger ces défauts et apporter des solutions concrètes aux problèmes de sécurité, de lisibilité et de performance. Les développeurs qui l’adoptent le font pour plusieurs raisons pratiques.

Twig offre une syntaxe beaucoup plus concise et lisible que les balises PHP traditionnelles. Il renforce aussi grandement la sécurité de vos applications grâce à des mécanismes automatiques. Et sa flexibilité, notamment avec l’héritage de templates, change la façon de construire les pages. Voyons ça en détail avec un comparatif direct.

1. Une syntaxe plus concise et lisible

Le tableau le montre bien : le code Twig est plus court et plus direct. Il n’y a plus de `web designers, de comprendre et de modifier les templates sans avoir de connaissances en PHP.

2. Une sécurité renforcée par défaut

C’est l’un des plus gros avantages de Twig. Par défaut, Twig échappe automatiquement toutes les variables que vous affichez. L’automatic output escaping signifie qu’il convertit les caractères spéciaux HTML (`<`, `>`, `&`, etc.) en leurs équivalents inoffensifs. Cela vous protège nativement contre les failles de sécurité les plus courantes, comme les injections XSS (Cross-Site Scripting), sans que vous ayez à y penser.

• En PHP, vous devez penser à utiliser `htmlspecialchars()` à chaque fois. Un seul oubli peut créer une faille.
• En Twig, la sécurité est la norme. C’est à vous de désactiver la protection manuellement si besoin, ce qui est beaucoup plus sûr.

3. Une flexibilité et une extensibilité utiles

Twig est plus qu’un simple outil pour afficher des variables. Il est conçu pour être flexible et s’adapter à vos besoins. Il propose des concepts puissants comme :

• L’héritage de templates : pour définir un squelette de page et ne redéfinir que certaines parties.
• Les filtres et fonctions : pour transformer des données directement dans le template (mettre en majuscules, formater une date, etc.).
• La possibilité de créer vos propres tags, filtres et fonctions : si les outils de base ne suffisent pas, vous pouvez étendre Twig pour l’adapter parfaitement à votre projet.

4. Des performances optimisées

Comme mentionné plus tôt, Twig ne ralentit pas votre application, au contraire. Grâce à son système de compilation et de cache, les templates sont transformés en code PHP pur et stockés. En production, votre serveur exécute ce code PHP optimisé, ce qui garantit des temps de réponse très rapides. Le surcoût lié à l’utilisation de Twig est quasi inexistant une fois le cache généré.

La Syntaxe Fondamentale de Twig Expliquée

La syntaxe de Twig est facile à apprendre car elle repose sur trois constructions principales, appelées délimiteurs. Chacune a un rôle bien précis. Une fois que vous les maîtrisez, vous savez utiliser 80% de Twig.

Afficher des données avec `{{ … }}`

C’est le délimiteur que vous utiliserez le plus. Les doubles accolades `{{ }}` servent à afficher le contenu d’une variable ou le résultat d’une expression. C’est l’équivalent du `echo` en PHP.

Vous pouvez afficher des variables simples, mais aussi des éléments de tableaux ou des propriétés d’objets.

<!-- Affiche une variable simple -->
<h1>Bonjour, {{ name }} !</h1>

<!-- Affiche une valeur d'un tableau associatif -->
<p>Prix : {{ product['price'] }} €</p>

<!-- Affiche une propriété d'un objet (syntaxe avec un point) -->
<p>Email de l'utilisateur : {{ user.email }}</p>

Exécuter de la logique avec `{% … %}`

Le délimiteur `{% %}` est utilisé pour les structures de contrôle. C’est avec lui que vous allez faire des boucles, des conditions, définir des blocs pour l’héritage, etc. Ces instructions ne produisent pas d’affichage direct, elles contrôlent le flux de génération du template.

Les conditions `if`

La condition `if` en Twig fonctionne comme en PHP. Vous pouvez utiliser `{% elseif %}` et `{% else %}`. La condition se termine toujours par `{% endif %}`.

{% if user.is_logged_in %}
  <p>Bienvenue, {{ user.name }} !</p>
{% else %}
  <a href="/login">Se connecter</a>
{% endif %}

{% if product.stock > 10 %}
  <p>En stock</p>
{% elseif product.stock > 0 %}
  <p>Stock limité !</p>
{% else %}
  <p>Rupture de stock</p>
{% endif %}

Les boucles `for`

La boucle `for` permet de parcourir les éléments d’un tableau ou d’un objet. C’est l’équivalent du `foreach` en PHP. La boucle doit se terminer par `{% endfor %}`.

Une fonctionnalité pratique de Twig est la clause `{% else %}` dans une boucle `for`. Le code contenu dans ce bloc ne s’exécute que si le tableau à parcourir est un empty array (tableau vide).

<h2>Liste des utilisateurs</h2>
<ul>
  {% for user in users %}
    <li>{{ user.name }} - {{ user.email }}</li>
  {% else %}
    <li>Aucun utilisateur trouvé.</li>
  {% endfor %}
</ul>

Ajouter des commentaires avec `{# … #}`

Le dernier délimiteur, `{# #}`, sert à écrire des commentaires dans votre template Twig. La principale différence avec les commentaires HTML `` est que les commentaires Twig ne sont pas du tout présents dans le fichier HTML final généré. Ils sont complètement ignorés par le moteur de template.

C’est utile pour laisser des notes aux autres développeurs ou à vous-même sans alourdir le code source de la page vue par le visiteur.

{# Ce commentaire ne sera jamais visible dans le code source HTML #}
<div class="container">
  <!-- Ce commentaire, par contre, sera visible -->
  {{ content }}
</div>

Maîtriser les Concepts Avancés : Filtres, Fonctions et Héritage

Une fois la syntaxe de base acquise, la vraie puissance de Twig se révèle avec ses concepts plus avancés. Les filtres, les fonctions et surtout l’héritage de templates sont des outils qui vous feront gagner un temps considérable et rendront votre code bien mieux organisé.

Les Filtres pour transformer les données

Les filtres sont des petites fonctions qui permettent de modifier une variable avant de l’afficher. On les applique avec le symbole `|` (pipe), suivi du nom du filtre. On peut même chaîner plusieurs filtres.

C’est très pratique pour des tâches de formatage courantes, car cela évite de surcharger votre code PHP avec de la logique de présentation.

• `{{ ‘bonjour le monde’|upper }}` → Affiche « BONJOUR LE MONDE »
• `{{ product.price|number_format(2, ‘,’, ‘ ‘) }}` → Formate un nombre en devise (ex: 1 234,56)
• `{{ ‘now’|date(‘d/m/Y’) }}` → Affiche la date actuelle au format français
• `{{ users|length }}` → Affiche le nombre d’éléments dans le tableau `users`

Les Fonctions pour générer du contenu

Les fonctions ressemblent aux filtres, mais leur syntaxe est différente et leur rôle est souvent de générer du contenu plus complexe. On les appelle comme une fonction classique, avec des parenthèses, qui peuvent contenir des arguments.

Le nombre de fonctions disponibles dépend souvent du framework que vous utilisez (Symfony, par exemple, en ajoute beaucoup pour la gestion des routes ou des assets), mais Twig en fournit quelques-unes de base.

<!-- La fonction range() crée un tableau de nombres -->
{% for i in range(1, 5) %}
  <p>Numéro {{ i }}</p>
{% endfor %}

<!-- Dans un framework comme Symfony, on utilise des fonctions pour les URLs -->
<a href="{{ path('app_product_show', { 'id': product.id }) }}">
  Voir le produit
</a>

L’Héritage de Templates : le concept le plus puissant

L’héritage de templates est sans doute le concept le plus important de Twig. Il permet de définir un template « squelette » (souvent appelé `base.html.twig`) qui contient toute la structure commune de votre site : le « , « , « , le header, le footer, etc.

Dans ce template de base, vous définissez des zones modifiables avec la balise `{% block %}`. Ces blocs sont des « trous » que les templates enfants pourront remplir.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>{% block title %}Mon Super Site{% endblock %}</title>
</head>
<body>
    <header>
        <h1>Mon Site</h1>
    </header>

    <main>
        {% block body %}{% endblock %}
    </main>

    <footer>
        <p>© 2025 - Tous droits réservés.</p>
    </footer>
</body>
</html>

Ensuite, pour une page spécifique (par exemple, la page d’accueil), vous créez un autre template qui « étend » ce modèle de base avec `{% extends ‘base.html.twig’ %}`. Dans ce template enfant, vous n’avez plus besoin de réécrire tout le HTML. Vous vous contentez de redéfinir le contenu des blocs qui vous intéressent.

Exemple de template enfant (`homepage.html.twig`) :

{% extends 'base.html.twig' %}

{# On redéfinit le contenu du bloc 'title' #}
{% block title %}Accueil - Mon Super Site{% endblock %}

{# On redéfinit le contenu du bloc 'body' #}
{% block body %}
    <h2>Bienvenue sur notre site !</h2>
    <p>Ceci est le contenu de la page d'accueil.</p>
{% endblock %}

Lorsque Twig rendra `homepage.html.twig`, il fusionnera les deux fichiers pour produire le HTML final complet. Cette approche évite la duplication de code et rend la gestion de vos vues incroyablement efficace. Pour en savoir plus sur toutes les possibilités, vous pouvez consulter la documentation complète de Twig.

Comment Installer et Utiliser Twig dans un Projet PHP ?

Vous pouvez tout à fait utiliser Twig sans un gros framework comme Symfony ou Drupal. C’est une bibliothèque indépendante (on dit aussi « standalone »). Le moyen le plus simple de l’installer est d’utiliser Composer, le gestionnaire de dépendances pour PHP.

Si vous n’avez pas Composer, c’est la première étape. Une fois qu’il est installé sur votre système, ouvrez un terminal à la racine de votre projet et tapez la commande suivante :

composer require twig/twig

Cette commande va télécharger Twig et ses dépendances dans un dossier `vendor/` et créer un fichier `autoload.php` qui vous permettra de charger facilement les classes.

<?php
// 1. On charge l'autoloader de Composer
require_once 'vendor/autoload.php';

// 2. On spécifie le dossier où se trouvent nos templates
$loader = new \Twig\Loader\FilesystemLoader('templates');

// 3. On crée l'environnement Twig
// L'option 'cache' active le cache de compilation, à utiliser en production
$twig = new \Twig\Environment($loader, [
    'cache' => 'cache/twig',
]);

// 4. On appelle la méthode render() pour afficher le template
// Le premier argument est le nom du fichier template
// Le second est un tableau associatif avec les variables à passer au template
echo $twig->render('homepage.html', ['name' => 'John Doe']);

Dans cet exemple, Twig va chercher un fichier `homepage.html` dans le dossier `templates/`. Il lui passera la variable `name` avec la valeur ‘John Doe’. Dans votre template, vous pourrez alors utiliser `{{ name }}` pour l’afficher. Le mode debug peut aussi être activé dans les options pour faciliter le développement.

FAQ – Questions fréquentes sur Twig

Twig est-il difficile à apprendre ?

Non, pas du tout. Si vous connaissez déjà le HTML et les bases de la programmation (variables, boucles, conditions), la syntaxe de Twig est très intuitive. Les trois délimiteurs `{{ }}`, `{% %}` et `{# #}` sont faciles à retenir. La prise en main est beaucoup plus rapide que celle d’un framework PHP complet.

Peut-on utiliser Twig sans Symfony ou Drupal ?

Oui, absolument. Twig est une bibliothèque indépendante. Bien qu’il soit le moteur de template par défaut de nombreux frameworks et CMS, il a été conçu pour fonctionner seul. Il vous suffit de l’installer avec Composer comme montré précédemment pour l’intégrer dans n’importe quel projet PHP, même un projet « maison » sans framework.

Twig est-il plus lent que le PHP natif ?

En développement, sans cache, il y a un léger surcoût car Twig doit analyser les templates. Cependant, en production, la performance est comparable à du PHP natif. C’est grâce au système de cache de compilation. Twig transforme vos templates en classes PHP optimisées. Une fois compilé, le code exécuté est du PHP pur, donc il n’y a quasiment aucune perte de performance.

Quelle est la différence entre Twig et Blade (Laravel) ?

Twig et Blade sont deux moteurs de template PHP populaires avec des philosophies similaires : séparer la logique de la vue et fournir une syntaxe plus propre. Leurs principales différences sont :

• Syntaxe : Twig utilise `{{ }}` et `{% %}`. Blade utilise `{{ }}` et des directives qui commencent par `@` (ex: `@if`, `@foreach`).
• Rigueur : Twig est plus strict sur la séparation. Il est très difficile d’exécuter du code PHP arbitraire depuis un template Twig, ce qui est une bonne pratique de sécurité. Blade est un peu plus permissif.
• Écosystème : Twig est plus agnostique et est utilisé par de nombreux projets (Symfony, Drupal, Craft CMS, etc.), tandis que Blade est spécifiquement conçu pour le framework Laravel.

Le choix entre les deux dépend souvent de l’écosystème dans lequel vous travaillez. Les deux sont d’excellents outils. Pour plus d’informations, vous pouvez visiter le site officiel de Twig.