Les Templates (« modèles » ou « gabarits »)
Par Ben S, dimanche 26 mars 2006 à 20:47 :: PHP :: #42 :: rss
SMARTY, le moteur et compilateur de templates PHP. Ce tutoriel a pour but de vous présenter brièvement les nombreux avantages que vous pourriez trouver à utiliser le moteur de templates Smarty. Mes principales sources de rédaction sont celles du manuel officiel de Smarty, ainsi que divers articles que j’ai parcouru sur le net.
1- Qu’est-ce qu’un système de templates ?
Un système de templates permet de rendre les scripts PHP indépendants de la présentation. En d’autres termes, les templates permettent de séparer la logique applicative de la logique d’affichage. Trop souvent, PHP est dénigré car on pense – à défaut – qu’il n’existe pas de solutions permettant de mettre en œuvre ce type de modularisation.
Les intérêts d’une telle approche sont multiples :
- designers et programmeurs peuvent travailler indépendamment : le designer ne s’occupe que du design, le programmeur uniquement du programme. Cette description peut paraître triviale, mais sans templates, design et code seront systématiquement mélangés, nuisant à la fluidité du processus de réalisation ;
- il devient extrêmement aisé de changer de langage de présentation sans perturber la logique de l’application (passer de HTML à XHTML ou XML par exemple) ;
- les changements dans la charte graphique seront grandement simplifiés, les modifications se résumant uniquement à la couche de présentation (aux squelettes, modèles ou gabarits) ;
- on a la possibilité de compiler les templates pour une rapidité d’exécution accrue, ainsi que l’implémentation d’un système de gestion du cache.
Au-delà des avantages de l’utilisation d’un système de templates, les avantages propres à Smarty (il existe en effet d'autres systèmes de templates) sont les suivants :
- pérennité et évolutions assurées (projet du PhpGroup)
- il est très rapide
- il sait ne recompiler que les fichiers de templates qui ont été modifiés
- il est possible de créer ses propres fonctions utilisateur et ses propres modificateurs de variables
- imbrications illimitées de boucles
- support de cache
- etc.
Vous trouverez un schéma vulgarisant le concept suivant en cliquant sur ce lien : Schéma
2- La procédure d'installation sur le serveur
Rendez-vous sur http://smarty.php.net/download.php, téléchargez-y la dernière version stable. Ensuite, décompressez l’archive et copiez le dossier libs. La configuration que je vous propose est celle de base (pour plus de détails, référez-vous au manuel Smarty, car cela n’est pas l’objet de ce tutoriel).
Pour notre exemple on suppose que nous sommes à la racine de notre serveur et que nous y avons créé un dossier smarty_test/. Dans le dossier smarty_test/, nous allons coller notre dossier libs copié précédemment. Ensuite, toujours dans le dossier smarty_test/, on va créer 4 nouveaux dossiers, pour finalement obtenir l’arborescence suivante :
smarty_test
cache (à créer)
configs (à créer)
libs (à coller)
templates (à créer)
templates_c (à créer)
Quelques explications rapides : smarty_test est notre dossier racine, cache pourra vous servir si vous approfondissez, configs également. S’en suivent les 3 dossiers absolument indispensables : libs qui contient les librairies, templates qui contiendra nos gabarits, templates_c qui contiendra nos templates compilées. Vous voila fin prêts pour commencer votre premier fichier Smarty !
3- Une première approche avec un exemple simple
Version PHP et HTML mélangés
Comparons un simple affichage avec et sans système de templates. Ces deux exemples absolument identiques d’un point de vue fonctionnel ont pour seul but de vous montrer que la maintenance et la lisibilité du code est grandement facilitée avec l'utilisation de templates :
Fichier index_sans_smarty.php
<? /* NOUS VOICI DANS LA VERSION PHP CLASSIQUE */ /* * @var string titre pour le tag <title> */ $title = "Exemple"; /* * @var string la phrase classique de test... */ $words = "Hello World !"; /* * @var array un tableau pour exemple */ /* * @var array un tableau à 2d numérique et associatif pour exemple */ "Benjamin", "SCHNEIDER", "23"), "Esther", "JAVIER", "21"), "Kröl", "LEHAMSTER", "1") ); ?> <html> <head> <title><?php echo $title; ?></title> </head> <body> <h1><?php echo $words; ?></h1> <p> <?php foreach($tokens as $token) { ?> <div><?php print $token ?></div> <?php } ?> </p> <table border="1" cellpadding="5"> <tr> <td>Prénom</td> <td>Nom</td> <td>Age</td> </tr> <?php $i = 0; foreach($array2d as $v1) { if($i % 2 == 0) $color = "#eee"; else $color = "#ccc"; ?> <tr style="background: <?php print $color; ?>;"> <?php foreach($v1 as $v2) { ?> <td><?php print $v2 ?></td> <?php } ?> </tr> <?php $i++; } ?> </table> </body> </html>
Version SMARTY
Fichier index_smarty.php
<?php /* * @description : inclusion de la classe smarty */ require './libs/Smarty.class.php'; /* * @description : création d'une instance de smarty */ $smarty = new Smarty(); /* * @var string titre pour le tag <title> */ $title = "Exemple"; /* * @var string la phrase classique de test... */ $words = "Hello World !"; /* * @var array un tableau pour exemple */ /* * @var array un tableau à 2d numérique et associatif pour exemple */ "Benjamin", "prenom" => "Benjamin", "SCHNEIDER", "nom" => "SCHNEIDER", "23", "age" => "23"), "Esther", "prenom" => "Esther", "JAVIER", "nom" => "JAVIER", "21", "age" => "21"), "Kröl", "prenom" => "Kröl", "LEHAMSTER", "nom" => "LEHAMSTER", "1", "age" => "1"), ); /* * @description assigne la variable $title à la template */ $smarty->assign('title', $title); /* * @description assigne la variable $words à la template */ $smarty->assign('words', $words); /* * @description assigne le tableau $tokens à la template */ $smarty->assign('tokens', $tokens); /* * @description assigne le tableau à 2d à la template */ $smarty->assign('array2d', $array2d); /* * @description nom de la template */ $smarty->display('example.tpl'); ?>
Fichier templates/example.tpl
{* SMARTY CECI EST UN COMMENTAIRE, TOUT CE QUI FIGURE ICI NE SERA VISIBLE QUE DANS VOTRE IDE. *} <html> <head> <title>{ $title }</title> </head> <body> <h1>{ $words }</h1> <p> <div>{ $token }</div> </p> <table border="1" cellpadding="5"> <tr> <td>Prénom</td> <td>Nom</td> <td>Age</td> </tr> <td>{ $array2d[i].0 } {* OU ON AURAIT PU ECRIRE : $array2d[i].prenom *}</td> <td>{ $array2d[i].1 } {* OU ON AURAIT PU ECRIRE : $array2d[i].nom *}</td> <td>{ $array2d[i].2 } {* OU ON AURAIT PU ECRIRE : $array2d[i].age *}</td> </tr> </table> </body> </html>
Cet exemple a certes peu d’utilité, mais il vous montrera, je l’espère, les immenses capacités de Smarty : je pense que vous serez d’accord pour constater que la méthode mélangeant le HTML et le PHP est peu lisible et mélange code et présentation. Cela passe peut-être sur une page, mais qu’en sera-t-il pour un site de plusieurs centaines de pages ? Toute la présentation sera « bloquée » par le fait qu'elle est dépendante de votre code ! Les templates constituent donc des outils surpuissants qui, couplés à l'utilisation de classes en PHP et de feuilles de style CSS, vous permettront des gains de temps considérables lors de vos cycles de développement.
Bien que cette méthode puisse paraître difficile au premier abord, les templates méritent vraiment qu'on s'intéresse à leur fonctionnement. Je vous rappelle d'ailleurs que Smarty propose un nombre énorme de fonctionnalités et de qualités qui n'ont pas été citées dans ce tutoriel qui a pour vocation de ne présenter que les bases du système.
J'espère que ce sujet vous aura intéressé, amicalement, Ben.


Commentaires
1. Le vendredi 31 mars 2006 à 23:19, par zagueyou
2. Le lundi 1 mai 2006 à 19:28, par Alexbad
3. Le mercredi 10 mai 2006 à 11:53, par thomas
4. Le jeudi 11 mai 2006 à 12:14, par Abderrahmane
5. Le mercredi 31 mai 2006 à 11:49, par jyl
6. Le jeudi 29 juin 2006 à 02:13, par Jérôme
7. Le jeudi 29 juin 2006 à 22:14, par Ben
8. Le jeudi 20 juillet 2006 à 10:44, par Mihaja Mickael
9. Le vendredi 28 juillet 2006 à 17:02, par makasayo
10. Le jeudi 3 août 2006 à 16:46, par phiphou
11. Le vendredi 15 septembre 2006 à 17:20, par gedeon555
12. Le samedi 28 octobre 2006 à 02:28, par b_free
13. Le mardi 26 décembre 2006 à 17:26, par gazporc
14. Le mercredi 3 janvier 2007 à 14:24, par armageddon
15. Le mercredi 24 janvier 2007 à 15:51, par Spartacus
16. Le mardi 30 janvier 2007 à 17:45, par sud-Luberon
17. Le dimanche 4 février 2007 à 18:00, par Ben
18. Le mardi 24 juillet 2007 à 17:31, par max
19. Le samedi 28 juillet 2007 à 12:24, par ato
20. Le mercredi 1 août 2007 à 14:27, par Hp
21. Le vendredi 3 août 2007 à 13:14, par Yng
22. Le samedi 4 août 2007 à 15:52, par HDP
23. Le mardi 28 août 2007 à 11:41, par ghaliano
Ajouter un commentaire
Les commentaires pour ce billet sont fermés.