Vous est-il déjà arrivé de vouloir modifier le menu de votre site et de devoir pour cela corriger le code XHTML de chacune de vos pages web ? Le menu d'une page web apparaît en effet sur chacune des pages et vous avez très certainement dû le recopier sur chacune de vos pages. Ca marche, mais ce n'est pas très pratique...
Une des fonctionnalités les plus simples et les plus utiles de PHP est l'
inclusion de pages. On peut très facilement inclure toute une page ou un bout de page à l'intérieur d'une autre page. Cela va grandement vous faciliter la tâche en vous évitant d'avoir à copier le même code XHTML plusieurs fois.
Avec ce chapitre, vous allez découvrir un des multiples avantages que vous donne le PHP lors de la création de votre site. C'est d'ailleurs ce qui m'a fait instantanément aimer ce langage lorsque je l'ai découvert, alors que je venais comme vous seulement d'apprendre le XHTML et le CSS.
La plupart des sites web sont généralement découpés selon le schéma suivant (que je reprends honteusement de mon propre cours sur le XHTML
) :
Le Site du Zéro ne fait lui-même pas exception à la règle d'ailleurs :
Le problème
Jusqu'ici, vous êtiez condamnés à copier sur chaque page à l'identique :
- L'en-tête
- Le menu
- Le pied de page
Cela donnait du code lourd et répétitif sur toutes les pages !
Regardez le code d'exemple ci-dessous qui représente une page web (appelons-là
index.php) avec en-tête, menus et pied de page :
Code : HTML 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Mon super site</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<!-- L'en-tête -->
<div id="en_tete">
</div>
<!-- Les menus -->
<div id="menu">
<div class="element_menu">
<h3>Titre menu</h3>
<ul>
<li><a href="page1.html">Lien</a></li>
<li><a href="page2.html">Lien</a></li>
<li><a href="page3.html">Lien</a></li>
</ul>
</div>
</div>
<!-- Le corps -->
<div id="corps">
<h1>Mon super site</h1>
<p>
Bienvenue sur mon super site !<br />
Vous allez adorer ici, c'est un site génial qui va parler de... heu... Je cherche encore un peu le thème de mon site :-D
</p>
</div>
<!-- Le pied de page -->
<div id="pied_de_page">
<p>Copyright moi, tous droits réservés</p>
</div>
</body>
</html>
|
D'une page à l'autre, ce site contiendra à chaque fois le même code pour l'en-tête, les menus et le pied de page ! En effet, seul le contenu du corps change en temps normal.
La solution
En PHP, nous pouvons facilement insérer d'autres pages (ou morceaux de pages) à l'intérieur d'une page.
Le principe de fonctionnement des
inclusions en PHP est plutôt simple à comprendre. Vous avez un site web composé de disons 20 pages. Sur chaque page, il y a un menu, toujours le même. Pourquoi ne pas écrire ce menu (et seulement lui) une seule fois dans une page
menu.php ?
En PHP, vous allez pouvoir inclure votre menu sur toutes vos pages. Lorsque vous voudrez modifier votre menu vous n'aurez qu'à modifier
menu.php et l'ensemble des pages de votre site web seront automatiquement mises à jour !
Comme je vous le disais, je vous propose de créer un nouveau fichier PHP et d'y insérer uniquement le code XHTML correspondant à votre menu, comme ceci :
Code : PHP | <div id="menu">
<div class="element_menu">
<h3>Titre menu</h3>
<ul>
<li><a href="page1.html">Lien</a></li>
<li><a href="page2.html">Lien</a></li>
<li><a href="page3.html">Lien</a></li>
</ul>
</div>
</div>
|
Faites de même pour une page
entete.php et une page
pied_de_page.php au besoin pour votre site.
Mais... la page menu.php ne contiendra pas le moindre code PHP... c'est normal ?
Une page dont l'extension est
.php peut très bien ne contenir aucune balise PHP (même si c'est plutôt rare). Dans ce cas, cela redevient une page XHTML classique qui n'est pas modifiée avant l'envoi.
En théorie, vous pourriez très bien enregistrer votre page avec l'extension
.html :
menu.html. Néanmoins, afin d'éviter de mélanger des pages
.php et
.html sur votre site, je vous recommande de travailler uniquement avec l'extension
.php à partir d'aujourd'hui.
Maintenant que vos "morceaux de pages" sont prêts, reprenez les pages de votre site, par exemple la page d'accueil nommée
index.php. Remplacez le menu par le code PHP suivant :
Code : PHP | <?php include("menu.php"); ?>
|
Cette instruction demande à l'ordinateur :
"Insère ici le contenu de la page menu.php".
Si nous reprenons le code que nous avons vu tout à l'heure et que nous remplaçons chaque code répétitif par un
include, cela donne le code source suivant :
Code : PHP 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Mon super site</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<?php include("entete.php"); ?>
<?php include("menus.php"); ?>
<div id="corps">
<h1>Mon super site</h1>
<p>
Bienvenue sur mon super site !<br />
Vous allez adorer ici, c'est un site génial qui va parler de... heu... Je cherche encore un peu le thème de mon site :-D
</p>
</div>
<?php include("pied_de_page.php"); ?>
</body>
</html>
|
Nous avons vu que la page PHP était
générée, donc la question que vous devez vous poser est : que reçoit le visiteur ? Eh bien il reçoit exactement le même code qu'avant !
Ce schéma vous aidera à comprendre comment les pages sont incluses :
La page finale que reçoit le visiteur est identique à celle que je vous ai montrée au début du chapitre... mais vous, vous avez gagné énormément en flexibilité puisque votre code n'est plus recopié 150 fois inutilement.
Le nombre d'include par page n'est pas limité, par conséquent vous pouvez découper votre code en sous-parties autant que vous le souhaitez !
Comme vous avez pu le constater, tout ça n'est absolument pas sorcier, et pourtant grâce aux inclusions on peut déjà rendre son site bien plus agréable !
Notez qu'il existe une autre façon d'inclure des pages en faisant le raisonnement inverse : on crée une page qui contient tout (en-tête, menus, pied de page) sauf le corps, et on inclut le corps de la page.
Pour réaliser cela cependant, il faut savoir manipuler des notions que nous ne connaissons pas pour le moment... et il y a des risques de provoquer des erreurs dangereuses pour votre site (ça fait peur hein
). Nous n'en parlerons donc pas pour le moment.
Flux RSS News
Twitter
Facebook