95 en ligne Comparateur | Sites | Forum | PhpBB | Actu | Glossaire | Codes | Tips | Liens | Livres | Lettre  

 Recherche

 Newsletter





 

Séparer le code du design : les systèmes de Templates

Astuce PHP par CedX



  <Accueil>  Déjà 30 astuces ! 
.NET [1]ASP [1]BdD [1]Coding [2]PHP [5]VbScript [1]Visual Studio .NET [19]



CedXPHP - Séparer le code du design : les systèmes de Templates

Template est un mot anglais qui peut se traduire par modèle ou gabarit.

Le principe est de séparer le code PHP de la mise en page HTML. Le code PHP dans un fichier, la mise en page contenant les balises HTML dans un autre fichier. On se retrouve alors avec, d'un coté, le script qui fait tout ce qu'il a à faire (ex.: récupération de données dans une base de données, traitement...), et d'un autre coté, la mise en page avec des zones prédéfinies où seront placées les données générées par le script. L'avantage évident est de pouvoir travailler uniquement sur la mise en page, sans modifier quoi que ce soit dans le code php et inversement, ou de diviser efficacement le travail à faire, le programmeur s'occupant uniquement de la partie scripting, et le designeur, de la mise en page.

Une méthode simple consiste à utiliser les possibilités des inclusions côté serveur (la fonction 'include()'). Une autre manière de procéder de manière efficace et rigoureuse est l'utilisation de modèles de page (template).

La bonne gestion des modèles de pages est un atout considérable pour certains programmes (ce constat n'est en effet pas toujours vrai) : en séparant la présentation du contenu, les modèles de pages permettent de personnaliser l'interface, ou de repenser celle-ci (pour l'adapter, le cas échéant, à une nouvelle charte graphique) avec la plus grande facilité. Les tâches sont par ailleurs mieux partagées entre le webmaster et l'équipe de développement.

Exemple concret
---------------
Commençons par réaliser une page Web conforme à la présentation globale de notre site. Insérons alors dans notre réalisation, aux différents endroits où seront inscrites les données en sortie du script PHP, un texte explicite qui fera référence au type de données reçu. Prenons un exemple très simple, mais dont le principe pourra être repris pour l'insertion "à la volée" de contenu bien plus complexe : nous allons utiliser PHP pour insérer la date dans notre page web (imaginons que cette page soit une confirmation de la commande d'un article sur une boutique en ligne : nous voulons certainement que figure la date sur cette page). Nous aurions pu utiliser JavaScript pour cela, convenons-en, mais nous pouvons imaginer que notre script PHP définitif ne renverra pas que la date du jour, mais beaucoup d'autres données pertinentes qui seront inscrites de la même manière sur notre page ainsi formatée.

Comment ça marche ?
-------------------
Le principe de la manoeuvre est élémentaire. Nous allons utiliser PHP pour lire le contenu de la page HTML qui sert de modèle (un fichier texte ou HTML), puis nous allons remplacer tous les textes spécifiques que nous y avons insérés (et qui servent de marqueurs) par la sortie correspondante (variable) du programme PHP.

Si notre page s'appelle "modele.htm", et que notre marqueur soit : ##INSERTION_DATE##

(par exemple : <div align="center">Aujourd'hui nous sommes le ##INSERTION_DATE##</div>)

alors notre script PHP ressemblera à ceci:

<?php
// lecture de la page modèle : le code HTML est stocké dans la variable $contenu
$fichier="modele.htm";
$pointeur=fopen($fichier, "rb");
$contenu=fread($pointeur, filesize($fichier));
fclose($pointeur);

// détermination de la date
$date_du_jour=strftime("%A %d %B %Y");

// remplacement du marqueur HTML par la date
$contenu=str_replace("##INSERTION_DATE##", $date_du_jour);

// renvoi de la page au navigateur
echo $contenu;
?>
 
Le remplacement de la chaine "##INSERTION_DATE##" par le contenu de la variable $date_du_jour fait appel à une opération de substitution classique en PHP. On peut utiliser les expressions régulières pour des critères de remplacement plus appronfondis (avec la fonction 'ereg()').

Quelques systèmes de Templates
------------------------------
Il existe de nombreux systèmes prêts à l'emploi de modèles de pages. Ils offrent de nombreuses possibilités, comme l'utilisation de blocs pour l'affichage conditionnel ou répété de données (liste de résultats retourné par une base de données par ex.).

Pour plus d'informations, voici quelques uns de ce systèmes :

- Smarty (sans doute le plus connu) : http://smarty.php.net/
- Integrated Templates : http://pear.php.net/package/HTML_Template_IT/
- patTemplate : http://www.php-tools.de/site.php?file=patTemplate/overview.xml
- phpTemplates : http://sourceforge.net/projects/php-templates/
...


Proposé par CedX le 09/01/2005 [vu 40178 fois]
Commentaires
skyderman
skyderman
15/01/06

J'aimerais créer un site utilisant le système de template de phpbb puis vendre ce site . Cela ne pose pas de problème avec la licence de phpbb ? (GNU General Public License v2)

merci de vos réponses
Ner0lph
Ner0lph
15/11/06

En gros : non mais tu DOIS distribuer les sources sur ton site et dire d'où ça vient.
hind15
hind15
20/02/07

bonjour !
j'ai un probleme mes pages php sur dreamwever s'ouvre pas enfin je vois juste le code je veux aussi voir l'interface graphique
merci d'avance
hind
CedX
CedX
20/02/07

A priori, il faut que tu mettes tes lunettes ! Non, je plaisante.

Faut bien regarder l'interface de Dreamweaver, normalement tu devrais avoir 3 boutons "Code", "Fractionner" et "Création". Ils te permettent de basculer d'un mode à l'autre (code source/graphisme).

Si tu ne vois pas ces boutons, va dans le menu Affichage. Tu verras ces 3 options.

(valable pour Dreamwweaver MX/8)

Pour participer, il faut d'abord vous identifier !
10 visiteurs ont déjà participé dont :
Redo [20]

Didier Téléchargez gratuitement et légalement des logiciels Microsoft ! Si, si ;)
  • Visual Studio 2010
  • Office 2010
  • Expression Studio 3
  • SQL Server 2008
  • et d'autres...

Au fil des news  
Magazines - Le N°132 de Programmez est disponible
Les alertes dans SharePoint 2007 - Comment SharePoint 2007 gère les User Alerts
Une des fonctionnalités de base de SharePoint, aussi bien dans Windows SharePoint Services (WSS) ...
Adobe - Photoshop.com Mobile pour Android 1.2
Adobe - Adobe dévoile une technologie de lecture.......
PHP - Experts PHP : participez au Forum PHP 2010 !
PHP - Fobec.com - Code source PHP & javascript
Foliotage alphabétique - Lister sur la première lettre d'un champ
Pour faire suite à l'article de JPierre sur la pagination alphabétique, voici, en ASP et en PHP, ...
Dreamweaver CS4 + Php + Mysql - Pagination alphabétique
Je vous propose la création d'une barre de navigation ou pagination alphabétique pour filtrer les ...
Adobe - HTML5 dans Dreamweaver CS5
VBScript - Déterminer si un chemin est absolu ou relatif
VBScript - Lire/écrire un fichier texte
Magazines - Le N°130 de Programmez est disponible
Hebergement - Hébergement à prix libre
Adobe - Adobe Creative Suite 5
PHP - Calcul de la date de Pâques
Magazines - Le N°128 de Programmez est disponible
Magazines - Le N°127 de Programmez est disponible
Dreamweaver CS4 + Php + Mysql - Trucs et Astuces - Part 6
Pour continuer dans le même style, je vous propose une suite au précédent article. Rechercher tous ...
Adobe - Adobe Photoshop.com Mobile pour iPhone 1.1
JavaScript - Ajouter une page dans vos favorites
Dreamweaver CS4 + Php + Mysql - Trucs et Astuces - Part 5 -
Je vous propose cette fois deux astuces. Comment exporter une feuille de style avec l'aide de ...
SharePoint Personalization Site Links - Les liens personnalisés des MySite SharePoint
Nous avons vu dans les articles précédents comment agrémenter les pages de recherche afin de ...
Magazines - Le n°126 de Programmez est disponible
Outils - Traducteur en ligne automatique pour site web
Adobe - Adobe Photoshop.com Mobile pour Iphone
Magazines - Le n°125 de Programmez est disponible
Adobe - Adobe AIR 2 et Flash Player 10.1version bêta
Les conférences autour des technologies Microsoft - Liste non exhaustive des grands évènements
Nous allons essayer de regrouper un grand nombre des évènements autour des technologies Microsoft ...
Magazines - Le n°124 de Programmez est disponible
PHP - Forum PHP 2009
Composants - eFace - XAML en Java
WPF - Désactiver le bouton de réduction d'une fenêtre
Magazines - Le n°123 de Programmez est disponible
Magazines - Le n°122 de Programmez est disponible
Auditer une ferme SharePoint - Assurer le bon fonctionnement de SharePoint
Dans le cadre de la bonne gestion de son environnement SharePoint, il est utile de faire un ...
SQL Server 2008 Report Builder 2.0 - Installation et utilisation de Report Builder 2.0
Dans le cadre de la création de rapports pour SQL Server Reporting Services 2008, un outil est ...
Magazines - Le HS N° 1 de Web Design est disponible
Adobe - Adobe propose en Open Source les frameworks.....
Outils - EntityBuilder
CSharp - Sérialisation XML de vos objets
  Tutorial : HTML | Scripting | ASP-PHP | ASP.net | SQL Server | XML
Sharepoint | XAML | Pocket | Dreamweaver | VML | Divers
  Scripts : Scripting | ASP-PHP | ASP.net | Divers
  Boutique | Annuaire | Bannières | Météo | Tribune | Partenariats | Recherches
v4.3 © Didier YVER
2001-2010
 
 

Corpo Sciences de Reims Partitions gratuites Carte, météo, annonces
ASP-magazine Groupes Utilisateurs Microsoft MVP DotNet Project TechNet