Créer son arborescence au moyen des menus
Créer l'arborescence au moyen des menus est une étape qui ne doit pas être faite au hasard. En effet, compte tenu de son rôle important, il est essentiel de réussir cette phase cruciale.
Nous avons vu au cours du chapitre consacré à la préparation du projet, comment structurer votre site. Ce chapitre sera essentiellement consacré à la mise en place de cette arborescence qui servira de "squelette" à votre futur contenu.
Au cours de cet article, nous allons donc créer et mettre en place le menu principal du site qui présentera nos futures pages et nous créérons le module qui permettra de l'afficher sur le site.
Mettre en place l'arborescence avec les menus
La gestion des menus
Les menus de Joomla sont géré par... le gestionnaire de menus. C'est à partir d'ici que l'on peut ajouter, supprimer ou modifier ses menus.
Pour accéder au gestionnaire de menus depuis le panneau d'administration, cliquez sur Menus puis sur le sous-menu Gestion des menus.
Ici sont listés tous les menus déjà créés. Pour créer un nouveau menu, cliquez sur le bouton Nouveau.
Renseignez les champs suivants :
- Titre - par exemple : menu secondaire,
- Nom système du menu - par exemple : menusecondaire,
- Description - ce champ est facultatif.
Cliquez sur Enregistrer et fermer.
Crééer un nouveau menu dans Joomla n'est pas plus compliqué que ça ! Maintenant que nous avons créé un menu, nous allons mettre en place l'arboresence du site en ajoutant plusieurs liens de menus notre menu principal.
Créer l'arborescence grâce aux menus
Le menu principal
Par convention, le menu principal affiche les liens vers les pages les plus importantes du site. C'est donc ici que vous devrez placer les éléments prioritaires pour vos visteurs (et pour vous). C'est aussi pour cette raison que ce menu doit être affiché sur l'ensemble des pages du site.
Dans ce menu, nous allons créer les liens de menu suivants :
- Accueil : affiche la page d'accueil du site,
- Notre société : article présentant la société,
- Historique : article affichant l'historique de la société,
- Nos missions : article présentant les missions de la société,
- Nos services : article présentant les services,
- Nos bureaux : affiche les différents bureaux de la société,
A partir du panneau d'administration, cliquez sur Menus dans le menu latéral gauche.
Cliquez ensuite sur Menu principal .
Pour l'instant, il n'y a qu'un seul lien de menu : Accueil et c'est un lien de menu de type Articles épinglés qui a été créé lors du processus d'installation de Joomla :
Nous allons maintenant ajouter nos différents liens de menus et en commençant par Notre histoire.
Cliquez sur le bouton Nouveau.
Sur cette nouvelle page, nous allons renseigner les champs suivants :
- Titre du lien. Indiquez ici le titre de votre page : Notre société
- Type de lien de menu. Cliquez sur le bouton bleu Sélectionner
Dans la rubrique Articles, sélectionnez Article.
- Sélectionner un article. Cliquez maintenant sur le bouton bleu Créer.
Une nouvelle fenêtre modale va s'ouvrir contenant le formulaire pour créer un nouvel article. Une fois la saisie terminée, cliquez sur le bouton Enregistrer & Fermer.
Lorsque vous avez terminé, cliquez sur le bouton Enregistrer & Fermer
Procéder de la même manière pour ajouter les autres liens de menu de premier niveau. Pour créer les liens de sous-menu (Historique et Nos missions), il vous suffit de sélectionner le lien parent Notre société comme ceci :
Si vous avez suivi les étapes décrites ci-dessus, vous avez créé l'arborescence de votre site avec le menu principal de Joomla 4 et obtenu ceci :
Attention Si votre sous-menu ne s'affiche pas au clic de la souris, ouvrez le panneau d'administration et vérifiez dans votre module Menu principal que le type de mise en page est bien réglé sur Dropdown dans l'onglet Avancé.
Pour le type de mise en page du menu principal, Cassiopeia nous offre 4 options:
- Menu rétractable par défaut (module):
Le menu est affiché sans sous-menus. Un "Menu Hamburger" s'affiche sur les téléphones portables.
- Par défaut (Module):
Le menu est affiché sans sous-menus. Sur les téléphones portables, le menu s'affiche verticalement.
- Collapsible Dropdown (Template):
Le menu est affiché avec des sous-menus. Un "Menu Hamburger" s'affiche sur les téléphones portables.
- Dropdown (Template):
Le menu est affiché avec des sous-menus. Sur les téléphones portables, le menu s'affiche verticalement.