Drupal 8

Création d’un module Drupal 8 – les templates

Dans ce tutoriel, nous allons voir comment créer et gérer nos templates. Ceci est la troisième partie du tutoriel pour la création d’un module Drupal 8.

Dans la première partie, nous avons vu les fichiers nécessaires à sa création.
Dans la deuxième partie, nous avons vu les Controllers et les Routes.

Comme dit dans les précédentes parties du tutoriel, Drupal est basé sur le Framework Symfony 3. Pour le rendu de vos pages, il utilise le moteur de template qui est Twig.

Le code source de ce tutoriel est disponible en bas de page.

Créer et utiliser un template Twig pour notre module

Créez un dossier à la racine de votre module et nommez-le templates.
Et dedans, créez un fichier portant le nom : afficher-message.html.twig.

Un fichier Twig est comme un fichier HTML, c’est juste l’extension du fichier qui change.

Dans ce cas précis, nous allons reprendre ce que nous avons fait dans le tutoriel précédent, qui consistait à afficher du texte venant d’une url précise sur une page.

Nous ajouterons une phrase devant ce texte du genre : « Votre paramètre est : « .
Votre fichier Twig aura cette tête-là :

Pour l’instant, ne faite pas attention à la partie {{ parametre }}.

Associer le Twig à un thème pour le module

Maintenant que nous avons notre Twig, il faut indiquer à notre module quand l’utiliser. Pour cela nous allons créer un fichier nom_de_votre_module.module à la racine du module.

Dans mon cas, je l’ai appelé tuto_module.module car mon module s’appelle tuto_module.

Nous allons saisir ceci dans le fichier :

Avec le code ci-dessus, nous venons de créer un thème afficher-message, qui utilise le fichier templates/afficher-message.html.twig et qui accepte une variable, parametre.

Utiliser le thème créé

Retournons dans notre Controlleur et modifions celui-ci :

Avec cette modification, nous utilisons le thème que nous avons créé, et nous passons le paramètre récupéré dans l’url (la variable $message).

Vous devriez avoir à la fin cette arborescence


Videz le cache de votre site, tapez url_de_votre_site/affichage-lien/tutoriel


Voici le résultat :

Débugger Twig

Pour débugger Twig et voir quel template est utilisé, nous allons modifier le fichier se trouvant dans sites/default/services.yml.

Cherchez la ligne debug: false et remplacez le false par true.
Sauvegardez, videz le cache et normalement quand vous ferait F12, vous aurez des lignes supplémentaires dans l’inspecteur.


Cela permet de voir quel template est utilisé et sur lequel celui-ci est basé si on utilise les templates d’un thème par exemple.

Dans ce cas-là, on voit que le thème utilisé est html–front.html.twig mais la base de ce template est html.html.twig.

Quelques fonctions à connaître

Donner la possibilité de traduire le texte de votre template

Pour donner la possibilité aux administrateurs de traduire les textes de vos twig, vous pouvez utiliser ceci :

Le texte sera alors disponible dans la partie Traduction de l’interface utilisateur.

Parcourir une liste d’élément

Comme en PHP ou dans les autres langages, Twig peux parcourir des élément avec une boucle :

Je vous invite à consulter ce lien pour retrouver les différentes fonctionnalités de Twig.

Si certains filtres de Twig ne fonctionnent pas sous Drupal 8, installez le module Twig Tweak. Il permet d’étendre ceux proposés par le CMS.

Conclusion

Twig est un moteur souple et assez puissant pour vous permettre de faire des rendus. Avec ce tutoriel, nous avons couvert les bases de la création d’un module Drupal 8.

Dans ce tutoriel, ce n’est qu’une infime partie de ce que l’on peut faire avec les templates.

Je vous mets le code source du module :

N’hésitez pas à me contacter pour me poser des questions ou me demander un cas concret, je ferais un tutoriel dessus.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *