Skip to content

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

🔗 Comment ajouter un lien d'accueil au menu WordPress

🔗 Comment ajouter un lien d'accueil au menu WordPress

Un menu de navigation sans lien vers la page d’accueil, c’est comme une porte d’entrée sans poignée. Un visiteur arrive sur une page interne via un moteur de recherche, lit le contenu… et ne sait pas où cliquer pour revenir à l’accueil. Le logo dans l’en-tête ne suffit pas toujours; certains utilisateurs cherchent instinctivement un élément «Accueil» directement dans le menu.

Avant la version 3.0, WordPress ne proposait pas cette option dans l’éditeur de menu standard, il fallait donc modifier le code ou ajouter un lien personnalisé manuellement. Aujourd’hui, tout est plus simple: quelques clics suffisent pour mettre le lien d’accueil en place. Et si vous êtes développeur ou que vous personnalisez un thème, le filtre wp_nav_menu_items règle la question avec une seule fonction.

Vous trouverez ci-dessous les deux méthodes: une méthode visuelle pour les utilisateurs classiques et une méthode programmatique pour ceux qui travaillent avec le code. Nous verrons également quand le lien doit être mis à jour et que faire s’il disparaît soudainement.

💡 Aperçu rapide:

  • Ajouter un lien d’accueil au menu WordPress via l’administration en moins d’une minute, sans extension.
  • Ajouter le lien de manière programmatique avec le filtre wp_nav_menu_items dans le fichier functions.php du thème.
  • Vérifier et mettre à jour l’URL après un changement de domaine ou un passage en HTTPS.

Méthode 1: via l’administration de WordPress

Cette méthode fonctionne avec WordPress 3.0 et les versions ultérieures, donc sur n’importe quel site moderne. Aucune extension ni modification de code n’est nécessaire.

Connectez-vous à l’administration et allez dans Apparence → Menus. Sur la gauche, vous voyez des blocs: «Pages», «Articles», «Liens personnalisés» et d’autres selon les extensions installées et les types de contenu.

Dans le bloc Pages, cliquez sur l’onglet Toutes (ou «Voir tout» dans les anciennes versions). La toute première entrée est une page nommée «Accueil». Cochez sa case et cliquez sur Ajouter au menu.

Bloc Pages dans l'éditeur de menus WordPress avec l'élément Accueil

Une fois ajouté, l’élément apparaît dans la structure du menu à droite. Faites-le glisser à la position souhaitée; on le place généralement en premier ou en dernier. Enregistrez le menu en cliquant sur Enregistrer le menu, et le lien d’accueil sera actif sur votre site.

Par défaut, WordPress utilise l’URL directe de la page d’accueil pour cet élément (par exemple, https://vash-sait.ru/). C’est important à retenir: si vous déplacez ensuite le site vers un autre domaine ou que vous passez de HTTP à HTTPS, le lien conservera l’ancienne adresse. Vous devrez ouvrir l’éditeur de menu et corriger l’URL manuellement, ou supprimer l’élément et le rajouter (WordPress insérera automatiquement l’adresse actuelle).

Méthode 2: ajout programmatique via un filtre

Si vous développez un thème sur mesure ou que vous souhaitez que le lien d’accueil soit ajouté automatiquement à l’activation du thème, utilisez le filtre wp_nav_menu_items. Il intercepte le HTML des éléments du menu avant l’affichage et vous permet d’insérer votre propre élément.

Placez le code dans le fichier functions.php du thème actif (ou d’un thème enfant pour ne pas perdre les modifications lors d’une mise à jour). Une alternative est l’extension Code Snippets: vous créez un extrait, collez le code et l’activez; les modifications sont alors indépendantes du thème.

Page de l'extension Code Snippets dans WordPress
1/**
2 * Adds a "Home" link to the main WordPress menu.
3 *
4 * @param string $items HTML markup of menu items.
5 * @param object $args wp_nav_menu() arguments.
6 * @return string
7 */
8function sdstudio_add_menu_home_link( $items, $args ) {
9 // Target menu location — replace 'main' with your own value
10 if ( 'main' !== $args->theme_location ) {
11 return $items;
12 }
13
14 $home_link = sprintf(
15 '<li class="menu-item"><a href="%s">%s</a></li>',
16 esc_url( home_url( '/' ) ),
17 esc_html__( 'Home', 'textdomain' )
18 );
19
20 // The link is added first — put $items . $home_link if you need it last
21 $items = $home_link . $items;
22
23 return $items;
24}
25add_filter( 'wp_nav_menu_items', 'sdstudio_add_menu_home_link', 10, 2 );

Le paramètre clé est 'main' dans la condition if. Il s’agit du slug de l’emplacement de menu (theme location) enregistré par la fonction register_nav_menu() dans le thème. Vous pouvez trouver votre slug dans le functions.php du thème: cherchez l’appel à register_nav_menu() ou register_nav_menus() et vérifiez le premier argument. Le plus souvent, c’est primary ou main.

La fonction est sûre: esc_url() échappe l’URL, et esc_html__() échappe le texte du lien tout en prenant en charge la traduction. Si vous utilisez un thème enfant, remplacez 'textdomain' par le domaine de texte de votre thème.

Après avoir inséré le code, actualisez le site et le lien d’accueil apparaîtra automatiquement dans le menu. Vous n’avez pas besoin de le retirer manuellement: il suffit de commenter ou de supprimer l’appel à add_filter() et tout reviendra à l’état initial.

Situations où le lien doit être mis à jour

Un lien d’accueil ajouté via l’administration stocke une URL en dur, celle qui figurait dans les réglages du site au moment de l’ajout. Trois scénarios classiques où cela pose problème:

  • Passage de HTTP à HTTPS. L’élément du menu continue de pointer vers http://..., les navigateurs peuvent afficher un avertissement de contenu mixte, ou la redirection peut échouer. Solution: ouvrez l’éditeur de menu, supprimez l’ancien élément «Accueil» et ajoutez-le à nouveau; WordPress insérera l’URL actuelle en https://.

  • Changement de domaine. Lors du passage d’un environnement de développement à la production (staging.site.rusite.ru) ou d’une migration vers un tout nouveau domaine. L’élément du menu conserve l’ancienne URL. Solution: identique à la précédente (supprimer et rajouter).

  • Déplacement d’un sous-répertoire vers la racine. Si le site passe de site.ru/blog/ à site.ru/, tous les liens en dur sont cassés. Après la migration, passez en revue TOUS les éléments du menu, pas seulement le lien d’accueil.

La méthode programmatique (via wp_nav_menu_items) ne présente pas ces problèmes: home_url('/') renvoie toujours l’adresse actuelle de la page d’accueil d’après les réglages de WordPress.

D’ailleurs, si vous travaillez souvent avec les menus, jetez un œil aux réglages de navigation sous Apparence → Personnaliser, où vous pouvez gérer les menus en temps réel avec un aperçu en direct. Pour des modifications avancées (ajout d’icônes aux éléments, méga-menus), il existe des outils dédiés, mais c’est un sujet pour un autre article.

Vidéo: ajouter un bouton d’accueil en 2 minutes

Si vous préférez regarder plutôt que lire, voici une courte vidéo en anglais avec une démonstration pas à pas à l’écran:

⁉️🤔 Foire aux questions

Puis-je ajouter un lien d’accueil sans extension ni code?

Oui, via l’éditeur de menu standard de WordPress: Apparence → Menus → bloc Pages → cochez «Accueil» → Ajouter au menu. C’est une fonctionnalité de base disponible depuis la version 3.0.

Pourquoi le lien d’accueil a-t-il disparu du menu après un changement de thème?

Les menus dans WordPress sont liés à des emplacements de menu (theme locations) enregistrés par le thème. Lorsque vous changez de thème, les anciens emplacements disparaissent et les nouveaux peuvent avoir des noms différents. Votre menu n’a pas disparu; il est simplement devenu «non assigné». Allez dans Apparence → Menus → onglet Gérer les emplacements et assignez le menu existant à un emplacement du nouveau thème. Tous les éléments, y compris le lien d’accueil, réapparaîtront.

Le menu a déjà un élément «Accueil», mais il mène à une page spécifique plutôt qu’à la racine du site. Comment corriger cela?

Il est probable qu’une page spécifique intitulée «Accueil» ait été ajoutée au menu au lieu du type spécial «Page d’accueil». Retirez cet élément du menu, puis dans le bloc Pages, trouvez l’entrée libellée «Page d’accueil» (WordPress la distingue clairement) et ajoutez-la. S’il n’y a pas un tel libellé, utilisez «Liens personnalisés»: dans le champ URL, saisissez /, et dans le champ «Texte du lien», tapez «Accueil».

Comment ajouter le lien d’accueil en dernière position dans le menu plutôt qu’en première?

Dans la méthode programmatique, inversez l’ordre de concaténation: au lieu de $home_link . $items, écrivez $items . $home_link. Dans l’éditeur visuel, faites simplement glisser l’élément «Accueil» à la fin de la liste et enregistrez le menu.

Est-il nécessaire d’utiliser esc_url() et home_url() dans le code?

Oui, c’est une bonne pratique WordPress. home_url('/') insère dynamiquement l’adresse actuelle du site depuis les réglages, vous n’aurez donc pas à modifier le code lors d’un changement de domaine. esc_url() échappe les caractères spéciaux et protège contre les attaques XSS. Omettre l’échappement dans du code de production est risqué.

La méthode par code fonctionne-t-elle sur une installation WordPress multisite?

Oui, home_url( '/' ) sur un multisite renvoie l’URL du site spécifique au sein du réseau (celle indiquée dans les réglages de ce sous-site). Chaque site du réseau aura son propre lien d’accueil. Si vous avez besoin d’un comportement différent selon les sites, enveloppez l’appel à add_filter() dans une condition qui vérifie l’ID du blog via get_current_blog_id().

Que faire si le lien d’accueil n’apparaît pas?

Vérifiez d’abord l’évidence: avez-vous bien enregistré le menu après avoir ajouté l’élément? Le bouton «Enregistrer le menu» se trouve en bas de la page; sans cliquer dessus, les modifications ne sont pas appliquées. Si le menu est enregistré mais que l’élément est absent, ouvrez le site en navigation privée (le cache du navigateur masque parfois les changements récents).

La deuxième cause probable est une extension de cache (WP Rocket, W3 Total Cache, LiteSpeed Cache). Videz le cache via l’administration de l’extension et revérifiez le site.

Si cela ne suffit pas, basculez temporairement vers un thème par défaut (Twenty Twenty-Five ou Twenty Twenty-Six). L’élément est-il apparu? Le problème vient alors du thème personnalisé; sa fonction wp_nav_menu() est peut-être surchargée avec des filtres supprimés. Vérifiez l’appel à wp_nav_menu() dans le template du thème: l’argument 'items_wrap' ne doit pas être une chaîne vide, et 'fallback_cb' ne doit être à false que si vous désactivez intentionnellement le repli.

Le code de la «Méthode 2» fonctionne sur n’importe quel thème tant que le theme_location est correct; il sert de filet de sécurité au cas où la méthode visuelle échouerait pour une raison quelconque.

Un lien d’accueil dans le menu est un petit détail qui inspire confiance. Un visiteur qui atterrit sur une page interne depuis un moteur de recherche retrouve le chemin vers le point de départ en une fraction de seconde et continue d’explorer. Sans cela, une partie de votre audience fermera tout simplement l’onglet. Deux minutes dans l’éditeur de menu ou dix lignes de code, et ce point d’entrée n’est plus jamais perdu.