Vue d'ensemble

Un menu divisé dans Joomla! est une technique de conception où une structure de menu unique est fractionnée et affichée dans différentes zones d'une page web. Plutôt que d'entasser une arborescence de navigation massive et multi-niveaux dans un seul menu déroulant surchargé, un menu divisé sépare les niveaux.

Par exemple, vos liens principaux (Niveau 1) s'affichent horizontalement dans l'en-tête du site, tandis que les sous-liens secondaires (Niveau 2 et plus) apparaissent dynamiquement dans une barre latérale ou un pied de page sur la page que ce lien de menu de premier niveau a ouverte.

Pourquoi utiliser un menu divisé ?

L'utilisation de menus divisés offre des avantages significatifs tant pour les performances du site que pour l'expérience utilisateur :

  • Un design épuré : il élimine les menus déroulants massifs et désordonnés qui submergent les visiteurs mobiles et masquent votre contenu.
  • Une synchronisation automatique : vous maintenez une seule arborescence de menu dans le backend du site. Joomla! gère la logique automatiquement, vous n'avez donc jamais à gérer des menus distincts pour les en-têtes et les barres latérales.
  • Une navigation contextuelle : le module de menu secondaire est intelligent. Il reste invisible jusqu'à ce qu'un utilisateur clique sur un élément de premier niveau qui contient effectivement des sous-pages, ce qui permet de garder des mises en page épurées.

Comment Joomla! traite la division

La magie des menus divisés repose sur les paramètres natifs du Module de menu de Joomla!. En plaçant deux modules de menu différents sur votre site mais en les pointant vers exactement le même conteneur de menu, vous contrôlez le résultat à l'aide de trois paramètres clés :

  • Niveau de départ : indique au module à quel niveau de l'arborescence du menu commencer le rendu.
  • Niveau de fin : indique au module où arrêter le rendu.
  • Afficher les éléments du sous-menu : détermine si les éléments enfants plus profonds doivent être complètement masqués ou rendus structurellement.

La logique de configuration

Pour faire fonctionner un menu divisé, il suffit de configurer deux modules de cette manière :

  • Le module d'en-tête : définissez le Niveau de départ sur 1 et le Niveau de fin sur 1. Cela limite l'en-tête à n'afficher que vos principaux liens parents (par exemple, Accueil, À propos, Services, Contact).
  • Le module de barre latérale : définissez le Niveau de départ sur 2 et le Niveau de fin sur Tous. Définissez l'Lien de base sur Actuel. Cela indique à la barre latérale : « Regarde sur quelle page se trouve le visiteur, vérifie si elle a des éléments enfants, et affiche-les ici. »

Le résultat final

Lorsqu'un utilisateur visite votre page d'accueil, il ne voit que la barre de navigation supérieure épurée. S'il clique sur Services, la page principale se charge, et la barre latérale se remplit instantanément avec Conception web, SEO et Marketing. Cela offre une expérience de navigation approfondie et fluide, sans codage complexe ni extensions fastidieuses.