Introduction au cadre de modélisation Smarty

Smarty est un moteur / framework de templates basé sur PHP. Il vous permet de séparer davantage votre logique métier de sa visualisation en supprimant autant de code PHP que possible loin de vos vues. Certains développeurs et frameworks préfèrent ne pas utiliser de moteur de templates, d'autres préfèrent utiliser PHP pur dans vos vues. Les deux points de vue peuvent être discutés, et à la fin, c'est principalement une question de goût. Quoi qu'il en soit, ce n'est jamais une mauvaise idée de l'essayer avant de décider de ne pas l'utiliser. C'est le but de ce tutoriel: essayer le framework Smarty Templating..

Étape 0: à quoi s'attendre

À la fin de ce didacticiel, vous aurez une idée de base du fonctionnement de Smarty. Vous pourrez charger des fichiers de modèle, leur transmettre des variables, utiliser une "mise en page" dans laquelle vos autres vues seront insérées et écrire vos propres modificateurs. Tout cela sera accompli en utilisant une classe de wrapper supplémentaire, que vous pourrez facilement intégrer à vos projets existants..

Étape 1: Configuration du projet

Le projet de ce tutoriel aura une configuration très simple, car nous ne développons pas une application réelle. Créez simplement un dossier de projet (le mien est nommé "smarty_example") avec un fichier index.php et un répertoire appelé "lib" à l’intérieur. Créez également un fichier nommé smtemplate.php dans le dossier "lib". Ensuite, créez un dossier "vues" dans "smarty_example". Ce dossier contiendra nos fichiers modèles smarty.

Avant de pouvoir utiliser quelque chose, vous devez l'installer. Heureusement, l’installation de Smarty est extrêmement simple et ne nécessite pratiquement aucune configuration. Tout d’abord, téléchargez Smarty et extrayez l’archive. Vous pouvez tout voir à l'intérieur de l'archive, mais nous n'aurons besoin que du dossier "libs" pour notre application. Renommez-le "smarty" et collez-le dans le dossier "lib" de notre application. Smarty utilise des dossiers supplémentaires. Créez donc les dossiers "templates_c", "cache" et "configs" dans notre dossier "lib / smarty". Si vous n'utilisez pas Windows, vous devrez donner 775 autorisations sur ces dossiers à votre serveur Web. Votre arborescence de répertoires devrait maintenant ressembler à ceci:

Étape 2: Création de la classe SMTemplate

Chaque programmeur a sa propre idée de l’API idéale. Pour ajuster légèrement l'API de Smarty et nous permettre d'ajouter des fonctionnalités supplémentaires, nous allons créer une classe wrapper appelée SMTemplate, qui se chargera des détails de smarty pour nous. Cette approche présente un autre avantage: si, à un moment donné, vous deviez utiliser un autre moteur de modèle, vous pouvez créer un wrapper pour ce moteur, tout en conservant l'interface SMTemplate, et donc sans interrompre le code qui utilise notre classe SMTemplate..

Stockage de votre configuration

Avant de coder les fonctionnalités de la classe SMTemplate, nous avons besoin d’un emplacement pour stocker certains détails de configuration. Vous pouvez le faire de différentes manières, c’est-à-dire en définissant les options de configuration en tant que constantes de classe, en les définissant en tant que constantes dans le fichier smtemplate.php ou en les conservant dans un fichier de configuration séparé. Je préfère la dernière option, je vais donc créer un fichier smtemplate_config.php. Smarty a besoin de configuration pour les répertoires de modèles, de modèles compilés, de cache et de configuration. Plus tard, nous pourrons aussi ajouter des options spécifiques à SMTemplate à notre fichier de configuration, mais pour le moment, cela fera:

 / ** * @file * Fichier de configuration de la classe SMTemplate * / $ smtemplate_config = array ('template_dir' => 'views /', 'compile_dir' => 'lib / smarty / templates_c /', 'cache_dir' => ' lib / smarty / cache / ',' configs_dir '=>' lib / smarty / configs / ',);

Construire la classe SMTemplate

La classe SMTemplate chargera ce fichier de configuration et transmettra les options à Smarty. Avant de pouvoir passer les options, nous avons besoin d'un objet de classe Smarty. Notre classe SMTemplate pourrait étendre la classe Smarty, mais je préfère utiliser une variable d'instance privée pour contenir l'objet Smarty. Jusqu'à présent, nous avons les éléments suivants pour notre classe SMTemplate:

 / ** * @file * Wrapper pour le moteur de modèle Smarty * / require_once ('smarty / Smarty.class.php'); require_once ('smtemplate_config.php'); classe SMTemplate private $ _smarty; function __construct () $ this -> _ smarty = new Smarty (); global $ smtemplate_config; $ this -> _ smarty-> template_dir = $ smtemplate_config ['template_dir']; $ this -> _ smarty-> compile_dir = $ smtemplate_config ['compile_dir']; $ this -> _ smarty-> cache_dir = $ smtemplate_config ['cache_dir']; $ this -> _ smarty-> configs_dir = $ smtemplate_config ['configs_dir'];

Modèles de rendu

Comme vous pouvez le constater, notre classe est encore assez pathétique, car elle ne peut rien rendre. Nous allons résoudre ce problème en ajoutant une fonction de rendu, qui charge un modèle et l'affiche..

 fonction render ($ template) $ this -> _ smarty-> display ($ template. '.tpl');

Afin de rendre n'importe quoi, nous aurons besoin de créer un fichier modèle, puis d'appeler la fonction de rendu à partir de notre fichier index.php. Le fichier de gabarit sera assez basique, contenant une simple page HTML. Nommez-le "home.tpl" et placez-le dans notre répertoire "views"..

Accueil

Bonjour le monde!

Maintenant, il ne reste plus qu'à créer un objet SMTemplate et à restituer "home". Ouvrez index.php, ajoutez les lignes de code suivantes et naviguez-y dans votre navigateur.

 require_once ('lib / smtemplate.php'); $ tpl = new SMTemplate (); $ tpl-> render ('home');

Étape 3: Affectation et formatage de variables

Si nous ne pouvions rien rendre de manière dynamique, Smarty serait plutôt inutile. Heureusement, nous pouvons affecter des variables à notre classe smarty et les afficher dans notre modèle. Nous pouvons aussi utiliser certaines fonctions de Smarty (enfin, des modificateurs) pour les formater correctement.

Passer un tableau de variables

Bien que Smarty prenne en charge l’affectation de variables, notre modèle SMT ne le fait pas (pour le moment). Nous fournirons le style d'attribution CodeIgniter, dans lequel vous passez un tableau à la fonction de rendu. Vous pouvez également adapter SMTemplate pour prendre en charge d’autres méthodes; Par exemple, les affecter à l'objet, puis utiliser __set pour les stocker dans un tableau est également une méthode propre. Pour ce tutoriel, passer un tableau fera l'affaire. Avant d’affecter les variables, nous modifions notre modèle pour quelque chose de plus dynamique. Dire bonjour au monde est une habitude pour les programmeurs, mais n'est pas très utile, alors utilisons une variable pour déterminer qui nous sommes salués. Deuxièmement, nous ajouterons la date du jour au message. Les variables peuvent être affichées en les enveloppant entre accolades.

Bonjour, $ récepteur! C'est $ date aujourd'hui!

Si vous actualisez la page, vous verrez que les variables n'ont pas été renseignées, car nous ne les avons pas définies. Le réglage des variables peut être fait en utilisant smarty-> assign, assignons-les donc. La fonction de rendu prendra maintenant un tableau de données optionnel comme second argument.

 fonction de rendu ($ template, $ data = array ()) foreach ($ data en tant que $ key => $ value) $ this -> _ smarty-> assign ($ key, $ value);  $ this -> _ smarty-> display ($ template. '.tpl');

Cela ne fonctionne toujours pas, car nous ne transmettons pas de tableau lorsque nous appelons notre fonction de rendu. Nous pouvons facilement le faire en modifiant quelques lignes dans notre fichier index.php.

 $ data = array ('receiver' => 'JR', 'date' => time (),); $ tpl = new SMTemplate (); $ tpl-> render ('home', $ data);

Si vous actualisez maintenant, la page indiquera quelque chose comme: "Bonjour JR! C'est aujourd'hui 1282810169!". Bien sûr, cette date n'est pas vraiment ce que nous avions en tête. Il doit être formaté, ce qui nous amène à la section suivante.

Utilisation de modificateurs pour mettre en forme des variables

Smarty n'est pas simplement un moteur de modèle qui recherche et remplace les variables. C'est également un cadre puissant qui vous permet de gagner du temps en utilisant des éléments tels que des modificateurs, des fonctions et des blocs. Si nous souhaitons formater notre date, par exemple, nous pouvons utiliser le modificateur date_format. Pour appliquer un modificateur à une variable, placez simplement un caractère de conduite et le nom du modificateur derrière celle-ci, suivis des arguments facultatifs séparés par des points. Le modificateur date_format prend un argument de chaîne, qui représente le format que prendra la date, et une date par défaut facultative, dont nous n’aurons pas besoin. Le code suivant affichera la date en tant que "jour (en décimales) mois".

Bonjour, $ récepteur! C'est $ date | date_format: "% d% B" aujourd'hui!

Cela devrait maintenant donner quelque chose de la forme "Bonjour JR! Nous sommes le 26 août aujourd'hui!" Maintenant, peut-être que nous voulons nous assurer que notre récepteur est en majuscule. Nous pouvons y parvenir en utilisant le modificateur supérieur.

Bonjour, $ receiver | upper! C'est $ date | date_format: "% d% B" aujourd'hui!

Maintenant, si je modifie index.php pour passer "jr" au lieu de "JR", le modèle affichera toujours "JR". Facile, n'est ce pas? Ensuite, nous allons inclure nos modèles dans une "mise en page" par défaut.

Étape 4: Travailler avec une mise en page

Avant de modifier notre classe SMTemplate pour activer les mises en page, nous allons d'abord créer une mise en page. Créez un nouveau répertoire nommé "layouts" dans notre dossier "smarty_example" et déplacez home.tpl à cet emplacement. Renommez-le en 'page.tpl'. Nous allons supprimer notre contenu précédent "hello world" et y insérer deux lignes horizontales. Notre contenu sera placé entre ces lignes..

    Accueil

Bien sûr, cela ne suffira pas, car Smarty ne saura pas où insérer notre contenu. Il existe plus d’une façon d’obtenir du contenu d’un autre modèle dans notre mise en page, et je vais utiliser la fonction de récupération de Smarty. Cette fonction renvoie notre modèle sous forme de texte, au lieu de l'afficher. Cela signifie que nous pouvons récupérer le modèle, puis l'assigner à une variable à utiliser dans notre modèle! Le nom de cette variable est à vous de choisir. Je préfixe mes variables spéciales avec __ afin de les distinguer des autres variables que j'utilise. J'appellerai celui-ci 'contenu', puisque nous lui attribuons le contenu de la page.

  
 $ __ content

Ceci conclut notre mise en page, créons donc des modèles à utiliser comme contenu. Je vais créer un modèle "hello", qui contiendra une ligne standard "hello world" et un modèle "lipsum" contenant du texte Lorem Ipsum. N'oubliez pas de donner à ces modèles une extension .tpl.

Bonjour le monde!

Lorem ipsum dolor sit amet, consectetur elip adipiscing elit. Aliquet Énéen dignissim diam à vulputé. Aenean nec ligula ac dolor fringilla pharetra. Cras in augue ac tellus dictum pellentesque. Integer elementum tempus lectus, non rutrum sem viverra a. Sed tincidunt sollicitudin dolor, ut blandit magna auctor non. Mécénas sed nibh felis. Donec dictum porta ante au faucibus. Morbi massa tellus, nom de pulvinar id porta id, imperdiet vel nibh. Donec lectus nulla, titulaire d'un identifiant temporaire, cursus vitae leo. Nulla eget nunc eu lorem posuere hendrerit ut ac urna. Aenean sodales lobortis egestas. Faucibus entier hendrerit tempor.

Adapter notre classe SMTemplate pour utiliser une mise en page est également extrêmement facile. Nous allons d’abord configurer une option de configuration pour le répertoire layouts, comme nous l’avons fait pour nos vues.

 / ** * @file * Fichier de configuration de la classe SMTemplate * / $ smtemplate_config = array ('layouts_dir' => 'layouts /', 'template_dir' => 'views /', 'compile_dir' => 'lib / smarty / templates_c / ',' cache_dir '=>' lib / smarty / cache / ',' configs_dir '=>' lib / smarty / configs / ',);

Ensuite, nous allons changer notre fonction de rendu. Nous fournirons la mise en page en tant que troisième paramètre facultatif et la laisserons par défaut à 'page'. Ensuite, nous allons récupérer le modèle demandé, l'assigner à la variable de contenu $ __ et afficher notre mise en page..

 fonction de rendu ($ template, $ data = array (), $ layout = 'page') foreach ($ data en tant que $ key => $ value) $ this -> _ smarty-> assign ($ key, $ value);  $ content = $ this -> _ smarty-> fetch ($ template. '.tpl'); $ this -> _ smarty-> assign ('__ content', $ content); $ this -> _ smarty-> display ($ layout. '.tpl');

Il y a plusieurs choses à considérer, concernant ce code. Tout d’abord, nous n’avons pas encore dit à Smarty où trouver nos mises en page. Nous pouvons le faire en ajoutant un répertoire de modèles, mais cette approche signifie que nous ne pouvons pas donner le même nom à nos mises en page. Nos modèles ne sauraient pas laquelle choisir. Nous pourrions résoudre ce problème en donnant à nos mises en page une extension différente, ou en définissant et en réinitialisant notre répertoire de modèles dans notre fonction de rendu, ou en utilisant des fonctions plus avancées de Smarty. Pour l'instant, nous allons simplement régler avec la contrainte que les présentations et les vues ne peuvent pas avoir le même nom. Nous pouvons ajouter notre répertoire de mises en page en utilisant la fonction addTemplateDir ().

 function __construct () $ this -> _ smarty = new Smarty (); global $ smtemplate_config; $ this -> _ smarty-> template_dir = $ smtemplate_config ['template_dir']; $ this -> _ smarty-> addTemplateDir ($ smtemplate_config ['layouts_dir']); // <- new line $this->_smarty-> compile_dir = $ smtemplate_config ['compile_dir']; $ this -> _ smarty-> cache_dir = $ smtemplate_config ['cache_dir']; $ this -> _ smarty-> configs_dir = $ smtemplate_config ['configs_dir'];

Vérifions cela en modifiant à nouveau notre fichier index.php.

 require_once ('lib / smtemplate.php'); $ tpl = new SMTemplate (); $ tpl-> render ('hello');

Ça marche!

Et si nous le changeons pour rendre 'lipsum', cela fonctionne aussi:

Étape 5: Créer vos propres modificateurs

Dans la dernière partie de ce didacticiel, je présenterai l’une des fonctionnalités les plus avancées de Smarty, qui en font plus qu’un simple moteur de templates. Smarty contient un certain nombre de fonctions standard et de modificateurs, mais il est également extrêmement facile de créer les vôtres. Regardons le modificateur que nous avons utilisé pour formater notre date:

 $ date | date_format: "% d% B"

Si vous voulez un modificateur personnalisé, il vous suffit d'écrire une fonction PHP.

Cela entraînera un appel à la fonction smarty_modifier_date_format (), avec $ date et notre chaîne de format comme arguments. Cette fonction renverra une chaîne et cette chaîne sera affichée. Donc si vous voulez un modificateur personnalisé, il vous suffit d'écrire une fonction PHP. Par exemple, nous allons écrire un modificateur appelé «weirdcase», qui mettra en majuscule toutes les consonnes et en minuscule toutes les voyelles, c'est-à-dire que «Lorem Ipsum» deviendra «LoReM IPSuM». Pour ce faire, créez un fichier appelé «modificateur.weirdcase.php» dans le dossier «lib / smarty / plugins». Notre modificateur prendra un seul argument, la chaîne qui doit être modifiée.

 / ** * plugin de modificateur weirdcase Smarty * * Type: modificateur * Nom: weirdcase * Objectif: transformer les consonnes en majuscules et les voyelles en minuscules * @param chaine * @return chaine * / fonction smarty_modifier_weirdcase ($ string)

Nous pouvons obtenir notre résultat en définissant un tableau "voyelles", en transformant notre chaîne en tableau, puis en la parcourant, et en vérifiant si chaque caractère est dans notre tableau de voyelles. Si c'est le cas, on le met en minuscule, sinon, on le met en majuscule. Les caractères modifiés sont ensuite ajoutés à une variable de résultat..

 fonction smarty_modifier_weirdcase ($ string) $ str_array = str_split ($ string); $ result = "; $ voyelles = array ('a', 'e', 'i', 'o', 'u'); foreach ($ str_array as $ char) if (in_array ($ voyelles, $ char) ) $ result. = strtolower ($ char); sinon $ result. = strtoupper ($ char); return $ result;

Cela devrait faire l'affaire, alors vérifions-le. Éditez le modèle 'lipsum.tpl' et ajoutez-lui un h1 contenant notre étrange 'Lorem Ipsum'.

'Lorem Ipsum' | cas étrange

Étape 6: Conclusion

Bien que Smarty représente bien plus que ce que je pourrais intégrer dans ce didacticiel, nous espérons que cela vous fournira des connaissances de base sur la façon de travailler avec. Vous savez essentiellement déjà tout ce que vous avoir besoin à savoir. Vous devriez également être en mesure de déterminer si vous aimez l’idée d’utiliser ce cadre de templates ou pas à ce stade. Les rubriques plus avancées, telles que les filtres et les blocs, sont utiles. Cependant, vous vous en sortirez bien. Vous pouvez trouver de la documentation sur les fonctionnalités plus avancées sur le site Web de Smarty. Merci d'avoir lu!

Code