Supposons que sur votre site web ait un menu à gauche. Ce menu est affiché sur toutes les pages de votre site.
En HTML il faut copier-coller ce menu dans toutes les pages, et pour modifier le menu il fallait modifier
toutes les pages.
En PHP vous créez une page menu.php qui ne contient que le menu si vous voulez.
Include dit à PHP insert le contenu de la page menu.php sur chacune de vos pages. PHP va le mettre là où vous
lui avez dit.
Et donc, si vous voulez modifier votre menu, vous modifiez juste menu.php et toutes les pages de votre site web
seront automatiquement mises à jour. C'est génial.
Code PHP :
<?php
include("menu.php");
?>
Un exercice pratique :
Nous allons créer un site avec PHP.
Dans notre site nous allons avoir des pages PHP qui contiennent toutes :
-Un entête avec le titre du site.
-un menu placé à gauche.
-un corps avec le contenu de notre site pour chaque page.
-un pied de page.
En HTML tout ça se trouve entre <body> et </body> i vous ne savez pas faire ça je vous invite
à voir le cours en html ICI
Le code est le suivant :
Code html :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title> titre du site </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<link rel="stylesheet" media="screen" type="text/css"title="style"href="style.css"/>
</head>
<body>
<div id="entete"> <!-- entête de la page -->
<h1>titre du site</h1>
</div>
<div id="menu"><!--menu -->
<div class="element_menu">
<a href="page1.html">Menu 1</a><br/>
</div>
<div class="element_menu">
<a href="page2.html">Menu 2</a><br/>
</div>
<div class="element_menu">
<a href="page3.html">Menu 3</a><br/>
</div>
</div>
<div id="corps"> <!-- corps de la page -->
<h2>titre de la page</h2>
<p> contenu de la page, contenu de la page, contenu de la page,
contenu de la page, contenu de la page, contenu de la page,
</p>
</div>
<div id="bas"> <!-- pied de la page -->
<p> contenue du pied dela page </p>
</div>
</body>
</html>
Le code css qui va avec :
body
{
width:770px;
margin:auto; /* Pour centrer notre page */
margin-top:20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. */
margin-bottom:20px; /* aussi pour le bas du navigateur */
background-color: #CCCCCC; /* Un fond pour éviter d'avoir un fond blanc */
color:#000000;
}
#entete /*entête*/
{
width:770px;
height:100px;
margin-bottom: 10px;
border: 1px solid black;
background-color:#333399;
color: #FFFFFF;
}
/* Le corps de la page */
#corps /*corps*/
{
margin-left: 154px;
margin-bottom: 5px;
padding: 10px;
margin-right: 1px;
color: #FFFFFF;
background-color: #524222;
border: 1px solid #FFFFFF;
}
#menu /*menu*/
{
width:140px; /* Il est important de donner une taille au menu */
border: 1px solid #FFFFFF;
margin-top: 0px;
float:left; /* Le menu flottera à gauche vous pouvez mettre float:right */
padding: 5px;
}
#bas /*pied de page*/
{
height:80px;
padding: 5px;
margin-bottom: 5px;
margin-top: 5px;
text-align: center;
color: #B3B3B3;
background-color: #525262;
border: 1px solid #FFFFFF;
}
.element_menu
{
color: #00FFFF;
border: 2px solid black;
margin-bottom: 5px; /* Pour éviter que les éléments du menu ne soient trop collés */
}
h1
{
text-align: center;
color: #00CCFF
}
h2
{
text-align: center;
color: #FF00FF
}
Exécutez ce code
Maintenant nous allons reprendre ce code mais en PHP.
En effet il existe deux méthodes pour le faire chaque une avec ses avantages et inconvénients.
La première méthode a l’avantage d’assurer une meilleur sécurité contre le hacker. Son inconvénient est
d’être moins pro, surtout si on veut changer toute l’apparence du site, mais moi je croix qu’on utilisant
les feuilles de style ce problème devient minime.
Dans cette méthode nous découpons le code html précédent en trois parties et donc créer trois pages PHP
comme suit :
Code page « haut.php » :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title> titre du site </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<link rel="stylesheet" media="screen" type="text/css"title="style"href="style.css"/>
</head>
<body>
<div id="entete"> <!-- entête de la page -->
<h1>titre du site</h1>
</div>
<div id="menu"><!--menu -->
<div class="element_menu">
<a href="page1.php">Menu 1</a><br/>
</div>
<div class="element_menu">
<a href="page2.phpl">Menu 2</a><br/>
</div>
<div class="element_menu">
<a href="page3.php">Menu 3</a><br/>
</div>
</div>
Code page «pied.php » :
<div id="bas"> <!-- pied de la page -->
<p> contenue du pied de la page </p>
</div>
</body>
</html>
et en fin code de la page « corps.php » :
<?php include("haut.php"); ?>
<div id="corps"> <!-- corps de la page -->
<h2>titre de la page</h2>
<p> Contenu de la page, contenu de la page, contenu de la page.
Contenu de la page, contenu de la page, contenu de la page.
</p>
</div>
<?php include("pied.php"); ?>
Vous pouvez nommer vos pages comme vous voulez pas nécessairement haut pied corps.
La deuxième méthode , a comme avantage la possibilité de changer toute l’apparence du site en un coup.
Mais elle a le grand problème de la sécurité et il faut faire très attention à votre code, si non votre
site sera très vulnérable au hack.
Le fonctionnement est l’inverse de la première méthode, c'est-à-dire qu’au lieu d’inclure l’entête et le
pied de page. On crée une page qui contient tout sauf le corps et sure cette page on incluse le corps.
Le code est le suivant :
Page entière sans le corps que je nomme « page.php ».
Code PHP
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title> titre du site </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<link rel="stylesheet" media="screen" type="text/css"title="style"href="style.css"/>
</head>
<body>
<div id="entete"> <!-- entête de la page -->
<h1>titre du site</h1>
</div>
<div id="menu"><!--menu -->
<div class="element_menu">
<a href="page1.php">Menu 1</a><br/>
</div>
<div class="element_menu">
<a href="page2.php">Menu 2</a><br/>
</div>
<div class="element_menu">
<a href="page3.php">Menu 3</a><br/>
</div>
</div>
<?php include("corps.php"); ?>
<div id="bas"> <!-- pied de la page -->
<p> contenue du pied dela page </p>
</div>
</body>
</html>
Comme vos le constatez cette page contient tout l’entête, le menu, etc. …
Et on crée la page « corps.php » comme ceci.
Code PHP :
<div id="corps"> <!-- corps de la page -->
<h2>titre de la page</h2>
<p> Contenu de la page, contenu de la page, contenu de la page.
Contenu de la page, contenu de la page, contenu de la page.
</p>
</div>
la page « corps.php » peut être tout ce que vous voulez ( un texte, un forum, un livre d’or etc… ).
En réalité le vrai code est un peu différent.
On va mettre une variable qui s’occupe de récupérer l’url de la page à inclure selon la demande du visiteur.
Le code est le suivant :
Code PHP
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title> titre du site </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<link rel="stylesheet" media="screen" type="text/css"title="style"href="style.css"/>
</head>
<body>
<div id="entete"> <!-- entête de la page -->
<h1>titre du site</h1>
</div>
<div id="menu"><!--menu -->
<div class="element_menu">
<a href="page1.php">Menu 1</a><br/>
</div>
<div class="element_menu">
<a href="page2.php">Menu 2</a><br/>
</div>
<div class="element_menu">
<a href="page3.php">Menu 3</a><br/>
</div>
</div>
<?php
$page = $_GET['page'];
include("$page.php");
?>
<div id="bas"> <!-- pied de la page -->
<p> contenue du pied dela page </p>
</div>
</body>
</html>
Si le visiteur clique sur le menu par exemple news sur votre page index alors l’url contient
index.php?page=news et donc on inclura la page « news.php ».
Et si un hacker change votre url il peut facilement changer le contenu de votre page et de là récupérer
toutes les données de votre site s’il le veut.
Il existe des solutions à ce problème de sécurité voilà une.
On utilise la boucle if :
Code PHP :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title> titre du site </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<link rel="stylesheet" media="screen" type="text/css"title="style"href="style.css"/>
</head>
<body>
<div id="entete"> <!-- entête de la page -->
<h1>titre du site</h1>
</div>
<div id="menu"><!--menu -->
<div class="element_menu">
<a href="page1.php">Menu 1</a><br/>
</div>
<div class="element_menu">
<a href="page2.php">Menu 2</a><br/>
</div>
<div class="element_menu">
<a href="page3.php">Menu 3</a><br/>
</div>
</div>
<?php
if ($_GET['page'] == "menu1")
{
include("menu1.php");
}
if ($_GET['page'] == "menue2")
{
include("menu2.php");
}
if ($_GET['page'] == "menu3")
{
include("menu3.php");
}
?>
<div id="bas"> <!-- pied de la page -->
<p> contenue du pied dela page </p>
</div>
</body>
</html>
<div id="bas"> <!-- pied de la page -->
<p> contenue du pied dela page </p>
</div>
</body>
</html>
Là si un hacker tente de changer l'url, aucun des if ne sera valable donc rien ne sera inclus.
Retourner au haut de la page..
|