Skip to content

Tout pour WordPress, le développement web — et plus encore

🧭 Comment créer un menu de navigation dans WordPress : un guide étape par étape

🧭 Comment créer un menu de navigation dans WordPress : un guide étape par étape

Un nouveau site sans menu, c’est comme un supermarché sans signalétique. Où se trouve la caisse? Dans quel rayon est le pain? Les visiteurs repartent parce qu’ils ne trouvent pas ce qu’ils sont venus chercher.

Même histoire avec WordPress. Une installation standard ne crée pas de menu automatiquement; vous devez le construire manuellement. Heureusement, les développeurs ont rendu cette tâche visuelle: pas de code, juste du glisser-déposer et quelques clics. Le menu de navigation s’assemble à partir de pages, de catégories et de liens personnalisés dans la simple interface Apparence → Menus.

Si vous avez déjà du contenu mais pas de navigation, vous perdez à la fois des visiteurs et du référencement. Une structure de menu claire aide Google à comprendre l’architecture de votre site. Voici un guide pas à pas, du premier clic jusqu’à un menu terminé avec sous-menus et placement en widget.

💡 Aperçu rapide:

  • Ouvrez l’éditeur de menu: Apparence → Menus, donnez-lui un nom et cliquez sur «Créer un menu»
  • Ajoutez des éléments: pages, catégories, liens personnalisés via le panneau gauche de l’éditeur
  • Organisez l’ordre par glisser-déposer et créez des sous-menus en décalant les éléments vers la droite
  • Configurez les emplacements d’affichage et enregistrez votre travail
  • Si nécessaire, affichez le menu dans la barre latérale via le widget «Menu personnalisé»

Les possibilités de menu dépendent de votre thème. Certains templates proposent un seul emplacement pour la navigation, d’autres en offrent quatre ou cinq: principal, mobile, pied de page, réseaux sociaux. Certains thèmes prennent en charge les menus animés et les méga-menus avec images. Mais les mécanismes de base (pages, liens, catégories) sont les mêmes pour tout site WordPress.

Nous allons détailler chaque étape ci-dessous. Même si vous venez d’ouvrir le panneau d’administration pour la première fois, vous aurez un menu fonctionnel à la fin de ce guide.

Étape 1: créer votre premier menu

Connectez-vous au panneau d’administration et allez dans Apparence → Menus. Sur une installation WordPress neuve, la page sera essentiellement vide: le panneau gauche affiche les éléments disponibles, la zone de droite sert à construire votre liste.

Première action: donnez un nom au menu afin de pouvoir les distinguer si vous en créez plusieurs:

  • Saisissez un nom explicite dans le champ Nom du menu, par exemple «Menu principal» ou «Navigation principale»

  • Cliquez sur le bouton Créer un menu

Création d'un nouveau menu dans le panneau d'administration WordPress

Le côté droit de l’écran change immédiatement: les blocs «Structure du menu» et «Réglages du menu» apparaissent. Comme la structure est vide, passons à l’ajout de contenu.

Vous n’aurez probablement pas besoin de cinq ou six menus à la fois. Mais la possibilité de créer une navigation distincte pour le pied de page ou la version mobile existe; WordPress n’impose aucune limite de quantité.

Étape 2: ajouter des éléments au menu

Concentrons-nous maintenant sur le panneau gauche de l’éditeur. Il contient des onglets avec tout ce que vous pouvez ajouter à la navigation:

  • Pages: une liste de toutes les pages publiées sur votre site
  • Articles: les billets de blog
  • Catégories: les taxonomies qui regroupent vos articles
  • Liens personnalisés: n’importe quelle URL, y compris des sites externes

Pour un blog type, le cœur du menu se compose de pages («À propos», «Contact», «Services») et de catégories («Actualités», «Guides», «Avis»). Voici la marche à suivre:

  • Ouvrez l’onglet souhaité
  • Cochez les cases en regard des pages/catégories qui doivent apparaître dans le menu
  • Cliquez sur Ajouter au menu
  • Répétez l’opération pour les autres onglets
Ajout de pages et de catégories au menu WordPress

Les pages et les catégories sont récupérées automatiquement; il suffit de cocher les cases. Les liens personnalisés fonctionnent un peu différemment: vous avez besoin de l’URL complète (par exemple, https://developer.wordpress.org) et d’un libellé (ce que les visiteurs verront dans le menu à la place d’une adresse brute).

Remarque: les catégories fonctionnent comme des regroupements d’articles. Lorsqu’un visiteur clique sur «Guides» dans le menu, il arrive sur une page listant tous les articles de cette catégorie. Pour en savoir plus sur le fonctionnement des catégories, consultez cet article de SitePoint.

Étape 3: organiser l’ordre et créer des sous-menus

Dès que vous avez au moins deux éléments dans la colonne de droite, vous pouvez modifier leur ordre. WordPress propose deux méthodes.

Glisser-déposer. Maintenez un élément avec le bouton gauche de la souris et faites-le glisser vers le haut ou vers le bas. Les éléments échangent leur position instantanément; l’interface fonctionne sans rechargement de page.

Organisation des éléments du menu par glisser-déposer dans WordPress

Utiliser la flèche. Cliquez sur la petite flèche à droite du nom de l’élément; une fiche avec des options se déploie:

  • Monter / Descendre: décaler d’une position
  • Tout en haut / Tout en bas: placer en première ligne
  • **Sous **** **: transformer en sous-élément (voir ci-dessous)
  • **Sortir de **** **: revenir au niveau supérieur
  • Supprimer: le lien rouge en bas de la fiche retire l’élément UNIQUEMENT du menu, sans affecter la page ou l’article réel

Les sous-menus se créent simplement en décalant les éléments vers la droite. Maintenez un élément, déplacez-le légèrement à droite du parent, et il devient un enfant. Sur le site, cet élément se déploiera lorsque les visiteurs survoleront le parent.

Création d'un sous-menu en indentant un élément vers la droite

Important: n’abusez pas de la profondeur. Un niveau d’imbrication est normal. Deux est un cas limite pour les sites très ramifiés. Trois, c’est trop: les visiteurs se perdent, et sur les écrans mobiles un tel menu devient un labyrinthe.

Vous pouvez obtenir le même résultat via la fiche de l’élément: dépliez avec la flèche, cliquez sur **Sous **** **. Pour revenir en arrière, utilisez **Sortir de **** ** ou faites simplement glisser vers la gauche.

Supprimer un élément du menu ne supprime pas la page de votre site. Les liens personnalisés sont perdus définitivement lorsqu’ils sont retirés, donc si vous prévoyez d’en restaurer un plus tard, notez l’URL à part.

Étape 4: réglages du menu avant enregistrement

Avant de cliquer sur «Enregistrer le menu», vérifiez deux paramètres en bas de la colonne de droite.

Ajouter automatiquement les pages. Si cette option est activée, chaque nouvelle page de premier niveau (sans parent) sera automatiquement ajoutée à ce menu. Sur les petits sites, cette option fait gagner du temps. Sur les sites comportant des dizaines de pages, elle a tendance à créer le chaos; gardez-la désactivée.

Emplacement d’affichage. Cette liste présente les emplacements que votre thème a réservés aux menus: navigation principale, pied de page, menu mobile, etc. Cochez ceux dont vous avez besoin; un même menu peut être affiché à plusieurs emplacements.

Paramètres d'ajout automatique de pages et emplacement d'affichage du menu

Lorsque la structure et les réglages vous conviennent, cliquez sur Enregistrer le menu. Le bouton apparaît à la fois en haut et en bas de l’éditeur; ils fonctionnent de manière identique.

Étape 5: options avancées via «Options de l’écran»

Tout en haut de la page de l’éditeur de menu se trouve un onglet Options de l’écran. Dépliez-le pour révéler une liste d’options supplémentaires masquées par défaut.

Paramètres supplémentaires du menu dans l'onglet Options de l'écran

Ce que vous pouvez activer:

  • Étiquettes et formats d’article: si votre thème utilise des types de format (en passant, galerie, vidéo), vous pouvez les ajouter au menu comme éléments distincts
  • Cible du lien: ouvrir l’élément dans un nouvel onglet (target="_blank")
  • Classes CSS: classes personnalisées pour styliser des éléments spécifiques via CSS
  • Relation de lien (XFN): un microformat pour spécifier les relations entre pages (rarement nécessaire; laissez vide)
  • Description: texte qui apparaît au survol d’un élément (dépend du thème)

En pratique, les options les plus utiles de cette liste sont l’ouverture dans un nouvel onglet (pour les liens externes) et les classes CSS (pour les besoins de design). Le reste sont des outils de niche que la plupart des sites ne touchent pas.

Étape 6: afficher le menu dans la barre latérale via les widgets

Si votre thème prend en charge les widgets, les menus peuvent être placés non seulement dans l’en-tête mais aussi dans la barre latérale, le pied de page ou toute autre zone de widget.

La marche à suivre:

  • Allez dans Apparence → Widgets
  • Trouvez le widget Menu personnalisé dans la liste disponible
  • Faites-le glisser vers la zone souhaitée, par exemple «Barre latérale» ou «Widgets de pied de page»
  • Dans la liste déroulante, sélectionnez le menu que vous avez créé précédemment
  • Ajoutez un titre (il apparaîtra au-dessus du menu dans la barre latérale) et cliquez sur Enregistrer
Ajout d'un menu à la barre latérale via le widget Menu personnalisé

Ce mécanisme fonctionne aussi bien pour les anciens thèmes utilisant les «Widgets classiques» que pour les thèmes basés sur des blocs utilisant l’éditeur de site; la logique est la même, seule l’interface change.

⁉️🤔 Foire aux questions

Puis-je créer deux menus différents et les afficher à des emplacements distincts?

Oui, sans restriction. Créez plusieurs menus via Apparence → Menus et attribuez à chacun son propre emplacement d’affichage. Un menu va dans l’en-tête, un autre dans le pied de page, un troisième dans la barre latérale via les widgets. Le nombre de positions disponibles dépend de votre thème: généralement 2 à 4 emplacements.

Que faire si mon thème n’a qu’un seul emplacement de menu?

Utilisez les widgets. Via Apparence → Widgets, vous pouvez placer des menus supplémentaires dans la barre latérale ou le pied de page, même si le thème n’y enregistre pas d’emplacements spéciaux. Vous pouvez aussi utiliser une extension de navigation avancée; par exemple, Max Mega Menu ajoute des méga-menus et des options de placement supplémentaires sans modifier le code.

Comment ajouter un menu à la version mobile de mon site?

La plupart des thèmes modernes construisent automatiquement le menu mobile à partir du même menu principal. Vous le cochez simplement dans la liste des emplacements d’affichage, et le thème adapte l’affichage pour les écrans mobiles (icône hamburger, liste déroulante). Si votre thème ne le fait pas, cherchez dans les réglages du personnalisateur (Apparence → Personnaliser) une section Menus / Menu mobile.

Puis-je ajouter un panier WooCommerce ou un bouton de recherche au menu?

Pas avec les outils standards. Par défaut, seules les pages, les catégories et les liens personnalisés peuvent être ajoutés aux menus. Pour les icônes de panier, les boutons de recherche ou les boutons de connexion, vous avez besoin soit d’une extension spécialisée (comme Menu Icons by ThemeIsle), soit d’un thème qui prend en charge ces éléments dans les réglages du personnalisateur.

Le menu se casse-t-il lorsqu’on change de thème?

Les menus eux-mêmes, non; ils sont liés au site, pas au thème. Mais les emplacements d’affichage assignés, oui, car chaque thème enregistre ses propres positions avec ses propres noms. Après avoir changé de thème, allez dans l’éditeur de menu et réassignez les emplacements dans le bloc «Réglages du menu».

En résumé: une navigation construite en six étapes

Créer votre premier menu prend trois minutes si vous savez où cliquer. En pratique, le déroulement ressemble à ceci: vous lui avez donné un nom → vous avez ajouté 4 ou 5 pages clés et quelques catégories → vous avez organisé l’ordre → vous avez enregistré. C’est tout. À partir de là, vous pouvez l’affiner: sous-menus pour la structure, placements supplémentaires via les widgets, classes CSS pour un stylage fin.

La règle principale: construisez les menus pour les visiteurs, pas pour l’esthétique. Trois ou quatre éléments clairs valent mieux que dix petits que personne ne comprend. Si une page est difficile à trouver en deux clics depuis le menu, il y a probablement un problème avec votre navigation.

Vérifiez l’aspect du menu sur un téléphone; un tiers du trafic des sites WordPress provient d’appareils mobiles. Un sous-menu mal formaté sur un smartphone réduit à néant tous les avantages de la navigation.