Regardez ici le code source de deux pages différentes de notre site. Ces codes sont très ressemblant. Pour bien que vous voyez la ressemblance, j'ai surligné ce qui diffère d'une page à l'autre :
Fichier index.php | fichier page2.php |
---|---|
Effectivement, toute la structure globale des pages reste la même. Seul le contenu spécifique à chaque page change.
Regardez comment nous allons simplifier nos fichiers index.php
et page2.php
:
Fichier index.php | Fichier page2.php |
---|---|
Vous voyez que les fichiers sont effectivement beaucoup plus simples, ils ne contiennent que :
Nous devons bien sûr créer les fichier debut_pages.php et fin_pages.php. Ils contiennent respectivement les parties communes aux débuts et aux fins de vos pages web. Donc :
Fichier debut_pages.php | Fichier fin_pages.php |
---|---|
Vous pouvez toutefois souhaitez personnaliser certaines informations dans chaque page, la plus évidente étant le title. Vous pouvez légitimement souhaiter que le title ne soit pas identique partout dans votre site mais reflète le contenu de la page dans laquelle on se trouve.
Pour ça on va utiliser une astuce simple : utiliser une variable $title
au démarrage de chacune de nos pages. Voilà le résultat :
Fichier index.php | Fichier page2.php |
---|---|
Et le fichier debut_pages.php prend en compte cette variable et devient :
Dans les vrais sites, le fichiers debut_pages.php ne se contentera pas d'afficher ce petit début de page mais effectuera tout ce qu'il y a de commun à toutes les pages du site comme par exemple :
session_start()
(oups ! mais vous ne savez pas encore ce que c'est qu'une session, on le verra plus tard),
Appliquez cette technique en fusionnant la structure de site Web HTML + CSS que vous avez fait au paragraphe "Lâchez-vous" du TP CSS 2 avec le jeu des multiplications.
Vous aurez donc trois pages :
Collez ici le code de la page debut_pages.php :
Collez ici le code de la page jeu_multiplication.php :
Collez ici le code de la page fin_pages.php :
Envoyez ici une capture d'écran du résultat dans le navigateur :