Template avec ob_start() en PHP

Cet article propose une méthode pour la gestion du template d’un site web en utilisant un système d’enregistrement dans un tampon avec la fonction ob_start() en PHP.

Identifier et distinguer le contenu et l’interface

L’idée présentée dans ce tutoriel est basé sur le principe de distinguer dans un site internet :

  • les éléments d’interface qui sont identiques à toutes les pages,
  • les éléments de contenu qui varient entre les pages.

sVoici ci-dessous une page de base contenant l’interface graphique (éléments communs à toutes les pages) et du contenu (contenu spécifique à la page).

    <!DOCTYPE html>
    <html>
        <head>
            <title>Gestion template : ob_start()</title>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <link rel="stylesheet" type="text/css" media="screen" href="styles.css" />
        </head>
        <body>
            <header>
                <p class="site-title">Titre du site</p>
                <p class="site-slogan">Slogan du site Internet</p>
            </header>
            <article>
                <h1>Titre de l'article</h1>
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id 
                    placerat odio. Aliquam in eros id sem ultricies pharetra at eu 
                    tortor. Etiam viverra, erat vel imperdiet sollicitudin, dui 
                    justo ornare libero, id blandit velit neque id arcu. Donec 
                    consequat nisi vestibulum ultricies malesuada. Ut vehicula 
                    consequat enim, quis accumsan massa luctus vel. In hac habitasse 
                    platea dictumst. Mauris accumsan nibh mi, et condimentum enim 
                    facilisis sed. Sed cursus erat leo, nec adipiscing eros at. 
                </p>
            </article>
            <footer>
                Designed by me
            </footer>
        </body>
    </html>

En observant ce fichier je peux donc isoler le contenu spécifique de la page, c’est à dire ce qui va changer entre les différentes pages du site :

<h1>Titre de l'article</h1>
<p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id 
    placerat odio. Aliquam in eros id sem ultricies pharetra at eu 
    tortor. Etiam viverra, erat vel imperdiet sollicitudin, dui 
    justo ornare libero, id blandit velit neque id arcu. Donec 
    consequat nisi vestibulum ultricies malesuada. Ut vehicula 
    consequat enim, quis accumsan massa luctus vel. In hac habitasse 
    platea dictumst. Mauris accumsan nibh mi, et condimentum enim 
    facilisis sed. Sed cursus erat leo, nec adipiscing eros at. 
</p>

Si j’isole le contenu, il me reste donc les éléments d’interface qui seront communs à l’ensemble des pages du site :

<!DOCTYPE html>
<html>
    <head>
        <title>Gestion template : ob_start()</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" type="text/css" media="screen" href="styles.css" />
    </head>
    <body>
        <header>
            <p class="site-title">Titre du site</p>
            <p class="site-slogan">Slogan du site Internet</p>
        </header>
        <article>
            

        </article>
        <footer>
            Designed by me
        </footer>
    </body>
</html>

Création d’une page de contenu

Je copie la partie identifiée comme étant le contenu dans un fichier que j’appelle page.php.
Tout au début du fichier, j’ajoute la ligne suivante :

<?php ob_start(); ?>

Cette fonction ob_start() permet d’initier une tamporisation de sortie (et pas temporisation). C’est à dire que tous les éléments que vous allez afficher avec l’élément de langage echo ou tout simplement en fermant la balise PHP avec ?> seront enregistrés dans une mémoire tampon.

Tout à la fin du fichier, je rajoute la ligne suivante :

La fonction ob_get_clean() permet de lire le contenu courant du tampon de sortie et de l’effacer en même temps. Cette ligne permet donc d’enregistrer dans la variable $content tout ce qui a été enregistré depuis l’initialisation de la tamporisation de sortie.

<?php $content = ob_get_clean(); ?>

Le fichier page.php contient donc le code suivant :

<?php ob_start(); ?>

<h1>Titre de l'article</h1>
<p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id 
    placerat odio. Aliquam in eros id sem ultricies pharetra at eu 
    tortor. Etiam viverra, erat vel imperdiet sollicitudin, dui 
    justo ornare libero, id blandit velit neque id arcu. Donec 
    consequat nisi vestibulum ultricies malesuada. Ut vehicula 
    consequat enim, quis accumsan massa luctus vel. In hac habitasse 
    platea dictumst. Mauris accumsan nibh mi, et condimentum enim 
    facilisis sed. Sed cursus erat leo, nec adipiscing eros at. 
</p>

<?php $content = ob_get_clean(); ?>

L’ensemble du contenu de la page qui est ainsi enregistré dans la variable $content. Je vais laisser ce contenu en suspens quelques minutes.

Préparation du fichier template.php

Je vais maintenant isoler dans un fichier template.php l’interface graphique.

<!DOCTYPE html>
<html>
    <head>
        <title>Gestion template : ob_start()</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" type="text/css" media="screen" href="styles.css" />
    </head>
    <body>
        <header>
            <p class="site-title">Titre du site</p>
            <p class="site-slogan">Slogan du site Internet</p>
        </header>
        <article>
            

        </article>
        <footer>
            Designed by me
        </footer>
    </body>
</html>

À l’emplacement où doit s’afficher le contenu, j’ai rajouté le code permettant de l’intégrer. Il s’agit tout simplement d’écrire le contenu de la variable $content qui a été créée précédemment.

<!DOCTYPE html>
<html>
    <head>
        <title>Gestion template : ob_start()</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" type="text/css" media="screen" href="styles.css" />
    </head>
    <body>
        <header>
            <p class="site-title">Titre du site</p>
            <p class="site-slogan">Slogan du site Internet</p>
        </header>
        <article>
            
            <?php echo $content ; ?>

        </article>
        <footer>
            Designed by me
        </footer>
    </body>
</html>

Le fichier template.php va donc me permettre de reconstituer la page complète. Pour cela il faut que je revienne sur mon fichier page.php.

Affichage du contenu

Il me suffit maintenant d’inclure le fichier template.php dans le fichier page.php sous la suivante :

<?php ob_start(); ?>

<h1>Titre de l'article</h1>
<p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id 
    placerat odio. Aliquam in eros id sem ultricies pharetra at eu 
    tortor. Etiam viverra, erat vel imperdiet sollicitudin, dui 
    justo ornare libero, id blandit velit neque id arcu. Donec 
    consequat nisi vestibulum ultricies malesuada. Ut vehicula 
    consequat enim, quis accumsan massa luctus vel. In hac habitasse 
    platea dictumst. Mauris accumsan nibh mi, et condimentum enim 
    facilisis sed. Sed cursus erat leo, nec adipiscing eros at. 
</p>

<?php 
$content = ob_get_clean(); 
include 'template.php';

Création de nouvelles pages

Pour chaque page que l’on souhaite créer, il suffit donc de partir de la structure suivante qui contient seulement quelques lignes de PHP.

<?php ob_start(); ?>

<?php 
$content = ob_get_clean(); 
include 'template.php';
S’abonner
Notification pour
guest

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

2 Commentaires
Le plus ancien
Le plus récent Le plus populaire
Commentaires en ligne
Afficher tous les commentaires
Steph
Steph
7 années il y a

Simple et fonctionnel ! Merci !