Trouver les fichiers de template avec débogage
Pour savoir quel template génère le balisage pour un élément donné, vous pouvez utiliser l’option intégrée debug de Twig. Ce paramètre affichera des commentaires HTML avec la sortie affichée, incluant les hooks de thème utilisés, les suggestions de noms de fichiers de template, ainsi que le fichier Twig exact utilisé pour rendre une section spécifique de votre balisage.
Activez le débogage Twig dans sites/default/services.yml en définissant debug:true dans la section twig.config (désactivez-le en environnement de production). Si vous utilisez Drupal 8 pour un multisite, vous devrez modifier le fichier services.yml dans le répertoire sites/currentsite pour le site spécifique que vous créez. Si services.yml n’existe pas encore, copiez le fichier default.services.yml depuis le répertoire sites/default et renommez-le en services.yml. Pour des instructions détaillées sur le débogage Twig, consultez la section « Débogage des templates Twig compilés ».
Après avoir vidé le cache, vérifiez la source de la page ; vous verrez un code semblable à ce qui suit :
<!-- THEME DEBUG --> <!-- THEME HOOK: 'node' --> <!-- FILE NAME SUGGESTIONS: * node--view--frontpage--page-1.html.twig * node--view--frontpage.html.twig * node--1--teaser.html.twig * node--1.html.twig * node--article--teaser.html.twig * node--article.html.twig * node--teaser.html.twig x node.html.twig --> <!-- BEGIN OUTPUT from 'core/themes/classy/templates/content/node.html.twig' --> <article data-history-node-id="1" data-quickedit-entity-id="node/1" role="article" class="contextual-region node node--type-article node--promoted node--view-mode-teaser" about="/node/1" typeof="schema:Article" data-quickedit-entity-instance-id="0"> .... </article> <!-- END OUTPUT from 'core/themes/classy/templates/content/node.html.twig' -->
Quelques points importants à noter dans cette sortie de débogage :
- Les suggestions de noms de fichiers sont listées de la plus spécifique à la moins spécifique.
- Le nom de fichier actuellement utilisé est marqué par un « x » à côté.
- En plus des balises BEGIN OUTPUT et END OUTPUT, vous trouverez le chemin complet vers le template rendu.