Kick-Start Développement WordPress avec Twig Introduction

Beaucoup de choses ont été écrites sur l'avenir de WordPress, et beaucoup pensent qu'il manque un langage de template, en particulier lorsque des plates-formes comme Django, Ruby on Rails, Node.js, Laravel et même Drupal en possèdent un. Des faits comme "WordPress alimente près de 25% du Web " rendre difficile la remise en cause de son système de templates basé sur PHP. Mais comme la modularité dans le code fait toujours défaut, on peut se demander quand le noyau aura un moteur de templates.

La bonne nouvelle est juste ici! Le moteur de création de templates Twig, associé à un plugin appelé Timber, peut nous aider à écrire du code super propre et modulaire dans WordPress. Dans cette série, nous discuterons de son implémentation et de son intégration avec WordPress. Je vais commencer par les bases de ce qu'est Twig et pourquoi vous en avez besoin. Dans les trois prochains articles, je vais expliquer différents types de modèles Twig intégrés à WordPress via Timber..

Qu'est-ce que Twig??

Twig est un moteur de templates flexible, rapide et sécurisé pour PHP. Twig vous est présenté par Fabien Potencier, le créateur du framework Symfony, et est considéré comme riche en fonctionnalités, complet, rapide et efficace.. 

Généralement, lorsque vous codez dans WordPress, vous mélangez des fragments de PHP avec HTML (c'est ce que nous appelons du code spaghetti). Ceci n'est pas attribué à un balisage super propre. Pour une approche modulaire et Doing it Right ™, il faut garder la Vue séparé de Les données. Avec Twig, vous pouvez séparer les vue couche du reste de l'application. Twig fonctionne sur le modèle MVC (modèle-vue-contrôleur) et permet de maintenir un code propre..

Pourquoi utiliser Twig?

Au fil des années, différents moteurs de templates PHP ont été développés, mais Twig les surpasse certainement tous dans les capacités suivantes.

Riche en fonctionnalités

Twig est l’un des moteurs de création de modèles PHP les plus puissants et les plus riches en fonctionnalités. Il prend en charge plusieurs héritages et échappements de sortie automatiques, et permet de diviser le modèle en plusieurs blocs ou composants afin de conserver une conception modulaire. Non seulement cela, mais les développeurs peuvent également ajouter plus de plugins pour répondre à toutes les exigences front-end.

Rapide et efficace 

Les modèles compilés via Twig entraînent beaucoup moins de frais généraux que les modèles PHP ordinaires. Les routines de codage sont hautement optimisées et vous économisez beaucoup de temps de développement. C'est également utile lorsque vous envisagez de modifier le framework de base, car Twig vous aide à créer une couche de gabarit distincte pouvant être connectée à tout framework dorsal, que ce soit Laravel ou WordPress..

Concepteur et développeur convivial

Twig répond aux exigences des concepteurs et des développeurs. Même si vous n'êtes pas un féru de code, utiliser Twig est simple et il semble correct de coder un modèle modulaire basé sur des composants. Sa syntaxe est facile à comprendre et évite d'implémenter des opérations PHP dynamiques dans les fichiers modèles. Dans l’ensemble, il est assez moderne et s’adapte à toutes les normes de codage les plus récentes. Le concept d'échappement de sortie est très complet lorsqu'il est manipulé avec Twig. 

Commençons par un exemple simple.

En PHP normal, vous obtenez une sortie comme celle-ci:

 

Dans Twig, les choses sont beaucoup plus simplifiées, c’est-à-dire que le code ci-dessus est compressé pour:

foo foo | escape foo | e # raccourci pour échapper à une variable #

La sortie d'échappement est aussi simple que cela dans Twig. Ajoutez simplement des crochets doubles, entrez le nom de la variable et vous obtiendrez une sortie. Mettez un tuyau avec un e à côté et nous avons commencé à échapper des trucs. Plus à ce sujet dans les trois prochains articles de cette série.

Garantir

Twig assainit et sécurise les données. C'est exclusif bac à sable Le mode surveille intelligemment l’ensemble du code et filtre les meilleurs résultats possibles. Cela signifie que les modèles générés par l'utilisateur peuvent être implémentés facilement et en toute sécurité. L'environnement sandbox ne peut être activé que globalement ou localement pour des modèles spécifiques tels que:

include ('post.html', sandboxed = true)

En cas d'erreur de syntaxe, Twig corrige votre fichier en générant un message contenant des détails tels que votre nom de fichier et le numéro de ligne avec le code problématique..

Flexible

Je viens de mentionner que Twig est un moteur de templates moderne, ce qui signifie également que vous pouvez étendre ses fonctionnalités car il est assez flexible. Il soutient pleinement une efficacité Lexeur et analyseur à travers lequel les développeurs peuvent définir des balises personnalisées, des filtres, des fonctions, etc..

Autres

Outre toutes les fonctionnalités mentionnées ci-dessus, Twig est très bien documenté et entièrement testé en unité. Son API et ses bibliothèques de modèles sont totalement stables et peuvent gérer toutes sortes de tâches complexes. Un livre en ligne dédié et une documentation complète sur l'API sont également disponibles..

Twig est le nouveau langage de template pour Drupal 8, ce qui est ma principale motivation pour utiliser ce moteur de templates en toute confiance. Les employés de XWP, en particulier Weston Ruter, travaillent sur une proposition visant à rendre Twig conforme aux normes VIP de WordPress.com.. 

Timber: Intégration de Twig avec WordPress

Jusqu'ici, toute la discussion a tourné autour de deux choses. Premièrement, nous devrions utiliser une approche modulaire consistant à garder les modèles séparés des données lors de la création de thèmes WordPress personnalisés. Deuxièmement, Twig peut nous aider à le faire. Mais qu'est-ce qui réunit ces deux?

Différents efforts ont été déployés pour réaliser le meilleur des intégrations entre Twig et WordPress. Timber, une tentative courageuse de ce type, a été créée par une agence Web appelée Upstatement. Il utilise le moteur de templates Twig, ce qui permet d’écrire du code modulaire et clair dans WordPress.. 

Timber avec Twig peut vous aider à créer des thèmes WordPress rapides et modulaires. De cette façon, vous pouvez garder votre code HTML séparé des fichiers PHP normaux, assurant ainsi un modèle de code plus durable. Le concept de garder HTML et PHP séparés permet au fichier PHP de se concentrer uniquement sur la fourniture Les données et la logique pendant que le fichier HTML (fichier Twig) se concentre sur la vue couche de l'application web.

Au total, Timber effectue trois tâches principales:

  • Il intègre Twig dans WordPress.
  • Il rend les modèles Twig.
  • Il ajoute une base de données WordPress.

Je pense que leur énoncé de mission dit tout:

Timber est un outil destiné aux développeurs qui souhaitent traduire leur code HTML en thèmes WordPress de haute qualité via une interface intuitive, cohérente et entièrement accessible..

  • Intuitif: L'API est écrite pour être centrée sur l'utilisateur autour des attentes du programmeur.
  • Cohérent: Tous les objets WordPress sont accessibles via des propriétés polymorphes telles que slug, ID et nom.
  • Accessible: Pas de boîtes noires. Tous les efforts sont déployés pour que le développeur ait accès à 100% de son code HTML..

Comment fonctionne le bois?

Dans le cas d'un thème WordPress standard, tous les fragments du code PHP et HTML sont intégrés et modifiés dans les mêmes fichiers de modèle PHP. Cependant, avec Timber, nous avons divisé les fichiers de modèle en deux fichiers de données différents: le fichier PHP et le fichier vue / modèle, c’est-à-dire le fichier Twig.. 

Ainsi, le premier est enregistré avec l'extension de fichier .php et le second a .brindille comme son extension. Par conséquent, si vous créez des fichiers de modèle pour single.php, vos fichiers seront nommés single.php et single.twig

Le premier fichier rassemble les données, tandis que le second est le modèle qui utilise les données au format HTML. De cette façon, vous pouvez ajouter des opérations dynamiques dans vos thèmes WordPress de manière modulaire..

Résumons le tout:

Timber gère les fichiers modèles de votre thème WordPress en fichiers PHP et HTML (Twig). De cette façon, vous séparez la logique de l'affichage. Il vous offre de nouvelles façons de créer, de styler et d’afficher votre thème..

Conclusion

Il y a beaucoup à aimer de Twig. Cet article n'était qu'une introduction aux avantages de l'utilisation d'un moteur de modélisation avec WordPress. Le code modulaire est un meilleur code et est facilement maintenable. Il est grand temps que les développeurs adoptent ce changement de flux de travail et je suis sûr que Twig peut les aider à résoudre ce problème.. 

Dans les prochains articles, je montrerai la mise en œuvre pratique des fichiers modèles avec Twig. Nous verrons comment implémenter Twig pour le rendu d'images, de commentaires et de menus WP, avec des exemples de code. Jusque-là, si vous avez des questions, n'hésitez pas. N'oubliez pas de vous connecter sur Twitter.