Publié le 04/04/2011
Auteur fobec
Réseaux sociaux
0 partages
0 tweets
0 plus
4 commentaires

Les principes d'un systeme de template HTML

Un template, appelé également gabarit, est une manière de construire ses pages HTML. Dans l'esprit de l'architecture MCV, le principe est de séparer le code PHP proprement dit de la mise en forme HTML. Ainsi l'interface d'un site peut être changée à volonté en adoptant un autre template sans pour autant modifier une ligne de code.
Afin d'illustrer le principe, l'exemple utilise 3 fichiers: un gabarit HTML, une class moteur de template et un fichier php contrôleur.

Gabarit HTML contact.tpl

La mise en page et les styles sont regroupés dans un gabarit HTML. Les données qui seront affichées à l'internaute sont balisées avec les caractères {}.
<html>
<head>
<title>Fiche de {NAME}</title>
</head>
<body>
<table>
  <tr>
    <td>Nom</td>
    <td>{NAME}</td>
  </tr>
  <tr>
    <td>Prenom</td>
    <td>{FNAME}</td>
  </tr>
  <tr>
    <td>Telephone</td>
    <td>{CALLNUMBER}</td>
  </tr>
</table>
</body>
</html>

Moteur de template TPLEngine.php

Class du moteur de template regroupant les fonctions de chargement du template et d'ajout de valeurs à afficher.
<?php
/**
 * Moteur de template basique
 * Stocker et remplacer les champs dans la page HTML
 * 
 * @author Fobec 2011
 */
class TPLEngine {
   /**
     * @var string the template buffer
     */
    protected $output="";
 
    /**
     * @var array tableau des couples champs/valeurs
     */
    private $dataset=array();
 
    /**
     * Charger le template à partir d'un fichier
     *
     * @param string $_file nom complet du fichier à ouvrir
     */
    public function load($_file) {
        $this->dataset=array();
 
        if (!file_exists($_file)) {
            throw new Exception("File $_file not found !!!");
        }
 
        $this->output=file_get_contents($_file);
    }
 
    /**
     * Magic : fixer les couples champs/valeur
     *
     * @param string $name nom du champs
     * @param string $value valeur
     */
    public function  addValue($key, $value) {
        if (isset($this->dataset[$key])) {
            $this->dataset[ $key ].="\n".$value;
        } else {
            $this->dataset[ $key ] = $value;
        }
    }
 
    /**
     * Assembler la page HTML pour l'affichage
     * @return string code HTML
     */
    public function   __toString() {
        $this->parse();
      //  $this->deleteUnusedTags();
        return $this->output;
    }
 
    /**
     * Remplacer les champs par la valeur pour l'ensemble du dataset
     */
    private function parse() {
        foreach ($this->dataset as $key  => $val) {
            $this->output=str_replace("{".$key."}", $val,  $this->output);
        }
    }
}
?>

Génération d'une page HTML

Les étapes de génération d'une page HTML sont:
- ouverture du gabarit HTML contact.tpl,
- ajout des valeurs à afficher (les données peuvent être chargées à partir de la base de données),
- remplacement des champs balisées {} par les données à afficher.
<?php
require_once 'tplengine.php';
 
$tplengine=new TPLEngine();
$tplengine->load("contact.tpl");
$tplengine->addValue('NAME', 'Duchemin');
$tplengine->addValue('FNAME', 'Georges');
$tplengine->addValue('CALLNUMBER', '12 34 56 78 90');
 
echo $tplengine;
?>

Points forts du système de template

Clarté du code: le code PHP est bien plus clair. La maintenance et les évolutions logiciel sont facilitées,

Performance: en séparant le gabarit du code PHP, un développeur et un webdesigner peuvent travailler en même temps sur le projet,

Flexibilité: modifier l'apparence d'une page web devient chose facile car seul le gabarit HTML sera modifié. De plus, il existe de nombreux templates à télécharger sur le web, par exemple pour le CMS WordPress.

Ajouter un commentaire

Les champs marqués d'un * sont obligatoires, les adresses emails se sont pas publiées.
avatar Do

Publié par Do

le 06/04/2011 à 09:49:43

Et lorsque l'on a un recordset a parcourir ? Que faut-il passer a la vue ? ligne par ligne ou un tableau ? ?
Le PHP est a lui seul deja un systeme de template :
>?php
echo $titre;
?>

Est-il judicieux de surcharger le traitement en terme de code (addValue...) et en terme de machine (parser la vue).

avatar Fred

Publié par Fred

le 07/04/2011 à 14:32:06

J'suis d'accord avec Do, PHP est deja un moteur de template.
Disons que le moteur de template permet de separer le code de la vue pour les debutants qui ont besoin qu'on leur impose des bornes..
.
Un bon developpeur, avec de l'experience, placera dans sa vue le code de presentation est uniquement ici. Les debutants sont souvent tentes d'y mettre l'acces a la BD, des calculs, etc.

avatar stam

Publié par stam

le 04/11/2011 à 17:18:20

Le code est interessant. Que doit contenir le fichier index ?

avatar Fobec

Publié par Fobec

le 04/11/2011 à 17:22:54

En fait, une page index est construite de la même manière que l'exemple test.php.

A lire aussi

Réseaux sociaux
Présentation de l'article
Catégorie
tuto - webmaster
Mise a jour
04/04/2011
Visualisation
vu 5138 fois
Public
Internaute
Auteur de la publication
Fobec
Admin
Auteur de 267 articles
|BIO_PSEUDO|
Commentaires récents

Publié par Outsourcing dans news

Le PageRank n'a plus une reelle importance a mon humble avis mais bcp de mes clients continue a juger de la qualite de ma prestation en referencement avec la barre verte!

Publié par Patrice dans CMS

Concernant la commande ShellExecute :

Si vous voulez lancer un programme dont le nom est contenu dans une propriété text,
caption, items bref d\'un string ... n'oubliez pas de tran...

Publié par gilles dans logiciel

Bonjour,

j'utilise quotidiennement votre excellent logiciel complet et ergonomique.

Mais depuis quelques jours j'ai un probleme il recherche indefiniment resolution du nom de l'hote.

Publié par mohammed dans java

Bonjour ,Merci pour ce travail ,juste j'ai une question pour ce qui concerne les textes avec les caracteres speciaux comment faire??

Publié par Romaingineer dans tuto

Question un peu similaire celle de nicolasterraes.

Je ne trouve pas de ligne dans wpcontentthemes, j'en trouve 2 ou trois dans WP includes mais qui utilsent la fonction echo...

Du coup...