Il existe plusieurs types de menus qui peuvent être utilisés dans un site Web :
Illustrons ceci à l'aide d'un exemple concret.
On y remarques trois menus différents :
Il est très avantageux d'avoir un site Web dont le menu est géré dynamiquement à partir d'une base de données. Il devient alors très facile d'ajouter ou d'enlever une option de menu sans devoir toucher au code.
Dans la structure proposée, chaque page peut apparaître dans plus d'une option de menu.
Par exemple, on retrouve souvent la page des coordonnées dans une option du menu principal de même que dans le menu secondaire. La structure permettra de n'entrer qu'une seule fois les informations relatives à la page même si elle se retrouve à plusieurs endroits dans les menus.
Autre exemple : lorsqu'un site propose un menu en pied de page, une même page peut être accessible via le menu principal et via le menu secondaire.
Cette structure permet également de créer des pages qui ne seront pas accessibles à partir d'une option de menu. Par exemple, une page qui détaille un produit, qui ne sera accessible qu'à partir de la page qui liste tous les produits.
Important : la table menus a une clé étrangère (parent_id) qui pointe sur un autre champ de la même table (id). Pour que tout fonctionne correctement, vous ne devez pas ajouter de contrainte d'intégrité référentielle entre ces champs.
La clé étrangère existe mais aucune contrainte ne vérifie ce que vous écrivez dedans.
CREATE TABLE menus (
id int(11) NOT NULL AUTO_INCREMENT,
page_id int(11) NOT NULL,
parametres varchar(50) DEFAULT NULL,
titre varchar(25) NOT NULL,
parent_id int(11) DEFAULT NULL,
ordre int(11) NOT NULL,
icone varchar(50) DEFAULT NULL,
afficher tinyint(1) NOT NULL,
PRIMARY KEY (id),
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
Cette table est détaillée ici : Travailler avec la table pages.
La table menus permet, comme son nom l'indique, de définir les menus.
Mais attention : chacun de ses enregistrements est une OPTION de menu et non un menu en tant que tel.
Voici le détail des informations contenues dans chacun de ses champs.
Ce champ est une clé étrangère pointant vers la table pages. Il indique quelle page sera affichée lorsque l'option de menu sera sélectionnée.
Ce champ permet de gérer le cas où une option de menu doit mener à un URL qui contient des paramètres, par exemple « actif=1 ».
Le début de l'URL est stocké dans la table pages.
Ce champ permet d'entrer des valeurs nulles car il n'est nullement requis pour la majorité des options de menu.
Il s'agit du texte qui sera affiché sur cette option de menu.
La taille est limitée à 25 caractères pour des raisons d'affichage.
La table menus est bâtie de façon à ce que chaque option de menu puisse pointer sur une autre option de menu pour identifier son parent. Par exemple, un menu « Clients » pourra avoir comme option de sous-menu « Lister », « Ajouter » et « Facturer ». Chacune de ces options de sous-menu pointera sur le menu « Clients » grâce au champ parent_id.
Autrement dit, le champ parent_id est une clé étrangère qui pointe vers un autre champ de la même table, soit id.
Les options du menu principal auront la valeur NULL comme parent_id et les options du menu secondaire auront la valeur -1.
Un menu ou un sous-menu sera donc composé d'une série d'options de menu qui ont la même valeur dans leur champ parent_id.
Ce champ vous permettra d'indiquer l'ordre dans lequel les options de menu seront affichées. L'usage veut qu'on donne des numéros non consécutifs (ex : 10, 20, 30) pour permettre d'insérer un élément entre deux autres plus facilement.
Il sera possible d'avoir un menu en icônes en inscrivant le nom du fichier de l'icône dans le champ icone ou encore le nom d'une icône du type Font Awesome. Le titre de menu sera alors utilisé dans l'attribut alt de la balise <img> ou dans l'attirbut title de la balise <i>.
Ce champ permet d'entrer des valeurs nulles car il n'est nullement requis pour la majorité des options de menu.
Avec ce champ, vous pourrez choisir de ne pas afficher une option de menu sans avoir à l'effacer de la table.
Puisque la table menus contient une clé étrangère menant vers la table pages, il est nécessaire de commencer par entrer les données dans la table pages.
Une fois ces données entrées, vous pourrez ajouter les options du menu principal et du menu secondaire.
Les données des sous-menus seront les dernières à être entrées puisqu'elles contiennent deux clés étrangères : page_id et parent_id.
Revenons à notre exemple présenté plus haut :
Voici un extrait des données qui permettent de stocker les informations sur ces menus :
L'entrée des données directement dans phpMyAdmin peut être une tâche difficile puisque pour chaque option de menu, il faut connaître le id de la page qui lui sera associée. Et pour chaque option de sous-menu, il faut connaître en plus le id de son menu parent.
Pour vous faciliter la tâche, il est conseillé de dessiner les menus sur une feuille. À côté de chaque option du menu principal, notez l'id du menu et l'id de la page associée puis entrez ces informations dans la BD. Ensuite, dessinez les options de sous-menu et du menu secondaire et faites la même opération.
Ex :
Si vous préférez, vous pouvez également travailler avec, sous les yeux, trois pages Web différentes :
▼Publicité
