HTML5 / CSS 2.x/3 / PHP / MySQL ...

PHP comme moteur de templates

On considère comme template toute page web qui utilise les informations issues de l'exécution de code PHP. Une page web est généralement affichée dans le contexte d'un navigateur web, donc codée en HTML. Nous ne traiterons que cet aspect du langage PHP.

La notion de template

Un template est une coquille vide. On la garnit avec les informations issues d'un traitement de données:

<?php $nom = "ALABAMA"; ?>
<td><?php echo $nom; ?></td>

Ici, c'est la balise td qui est notre coquille vide.

Une page web, écrite en HTML, et sauvegardée au format HTML ne peut contenir de code PHP. Pour intégrer du code PHP, il faut la sauvegarder avec l'extension php:

Toute page HTML peut devenir un template. Il faut simplement conserver une certaine logique dans la structuration de notre code entre html et php: c'est HTML qui contient du code PHP et non l'inverse:

<?php 
$nom = "ALABAMA";
echo "<td>$nom</td>";

est l'exemple type de ce qui est déconseillé. Certes, ça fonctionne, mais ce n'est pas logique:

<table>
<tr>
    <?php 
    $nom = "ALABAMA";
    echo "<td>$nom</td>";
    ?>
</tr>
</table>

Avec un IDE comme NetBeans ou Zend Studio (sur base Eclipse), l'analyseur syntaxique ne vas pas associer l'élément td pris en charge par le code php:

<table>
<tr>
</tr>
</table>
comparaison entre un mauvais template et un bon template

Dans l'image ci-dessus, nous avons mis deux versions:

L'analyseur de structure du code HTML indique l'arborescence (chemin) dans notre structure HTML. Ici, en ligne 13, si on pose le curseur sur l'élément td, l'analyseur affiche le chemin dans l'arborescence HTML juste avant la ligne 1: table tr td. En outre, l'analyseur syntaxique sur-ligne en jaune les marqueurs de début et de fin de la structure HTML en cours de traitement. C'est particulièrement utile quand on traite des structures HTML assez complexes.

Eviter les bascules PHP vers HTML

On évitera les bascules de PHP vers HTML qui génèrent des monstruosités de ce genre:

<?php
$options = array('éditer', 'supprimer', 'désactiver', 'réactiver', 'relancer')
?>
<select name="mesOptions">
<?php
foreach($options AS $key => $val) {
?>
<option><?php echo $val; ?></option>
<?php
}
?>
</select>

Certes, notre code PHP n'affiche pas directement d'éléments HTML, mais on rompt la structure de la boucle foreach en revenant en HTML. Voici la manière correcte d'exploiter une boucle de ce type en exploitant php comme moteur de template:

<?php
$options = array('éditer', 'supprimer', 'désactiver', 'réactiver', 'relancer')
?>
<select name="mesOptions">
<?php foreach($options AS $key => $val): ?>
    <option><?php echo $val; ?></option>
<?php endforeach; ?>
</select>

Cette manière d'imbriquer notre structure peut surprendre. A chaque marqueur de structure correspond un marqueur fermant la structure:

Exemple pratique. Nous avons une classe qui détecte l'entrée sur notre site web à l'aide d'un téléphone mobile. On va exploiter PHP comme moteur de template de cette manière:

<?php if ($detect->isMobile()): ?>
    <div class="titre" 
     style="background: wite url('images/fondPageAccueil.mobile.jpg') no-repeat;">
<?php else: ?>
    <div class="titreAccueil">
<?php endif; ?>
TITRE DE NOTRE PAGE
</div>

Un autre exemple, afficher des données issues de notre base de données:

<?php
$Fiches->resetConditions("valide='Attente'");
$listeFiches = $Fiches->getListeFiches(false);
?>
<article>
<h2>Liste fiches en attente de validation</h2>
 
<table>
    <tr>
        <th>pays</th>
        <th>adresse</th>
    </tr>
    <?php foreach ($listeFiches AS $row): ?>
    <tr>
        <td><?php echo $row['pays']; ?></td>
        <td>
            <a href='index.php?page=editionFiche&num_fiche=<?php echo $row['num_fiche']; ?>'>
            <?php echo $row['adresse']; ?></a>
        </td>
    </tr>
    <?php endforeach; ?>
</table>
</article>

En utilisant PHP comme moteur de template, on regroupe les marqueurs de début <?php et fin ?> de code PHP sur la même ligne que le marqueur de structure:

   <?php foreach ($listeFiches AS $key => $row): ?>

On veille particulièrement à respecter l'indentation de notre code HTML et bien aligner les structures PHP entre elles.

Dans cette page, voyons comment réécrire du code de débutant affichant les données d'une table.

Tous les articles sur ce thème