Ajouter un menu wordpress

Il n’est pas nécessaire d’ajouter un plugin pour créer un nouveau menu. Limitons les plugins et pensons optimisation avant tout !

Emplacement menu webmaster wordpress

Il n’est pas nécessaire d’ajouter un plugin pour créer un nouveau menu. Limitons les plugins et pensons optimisation avant tout !

Imaginons que vous venez d’installer votre CMS WordPress et votre thème. Premier constat, il manque un menu dans votre pied de page permettant d’afficher les mentions légales. Pas de soucis, voici un petit tutoriel vous expliquant comment ajouter un emplacement de menu à cet endroit. Il vous faudra avant tout créer un child thème (Pour plus d’information sur la création d’un thème enfant, c’est ici : “installation d’un thème enfant”).

Ajouter la zone de menu dans le back-office wordpress

Pour cette partie, il faut avoir des petites connaissances en PHP (je vous demande pas d’être un développeur wordpress chevronné) et savoir naviguer dans les fichiers de WordPress. Je ne vous demande pas de coder un thème (Laisser cela à un webmaster freelance), mais de rajouter les lignes de codes suivantes dans le fichier functions.php de votre thème enfant.

function add_new_menus() {
  register_nav_menu('menu-footer',__( 'Mon menu footer' ));
}
add_action( 'init', 'add_new_menus' );
  • création de la fonction avec le nom souhaité (Attention de bien respecté la syntaxe : pas d’accent, pas de majuscule et des “_” à la place des espaces.
  • Ajout du hook “register_nav_menu (Premier attribut, l’identifiant du menu, second attribut, le nom du menu dans le footer). Pour ces deux attributs, mettez ce que vous voulez.
  • On ajoute le hook à l’initialisation du backoffice et on appelle la fonction.

Visibilité du menu dans le backoffice.

Après avoir ajouté le morceau de code dans le fichier functions.php, vous pouvez vous rendre dans le backoffice WordPress et voir l’emplacement du menu depuis : Apparence -> Menus

Emplacement menu wordpress

Ajout de l’emplacement menu à l’endroit souhaité

Si nous récapitulons le process :

Il reste désormais à faire appel au menu à l’endroit désiré.

Pour savoir dans quel fichier naviguer, je vous invite à télécharger le plugin Show Current Template.

Voici le rendu :

menu wordpress - Show current Template

Dans mon exemple, je peux voir le dernier lien de la capture : /themes/nicowebmaster/footer.php (puisque je souhaite ajouter mon menu dans le pied de page)

<?php
wp_nav_menu( array( 
    'theme_location' => 'menu-footer', 
    'container_class' => 'custom-menu-class' ) ); 
?>

Ce qui donne dans mon fichier footer.php

<footer id="colophon" class="site-footer">
   <div class="container">
      <div class="row">
	 <p>&copy; 2021 - Tous droits réservés</p>
	 <?php
	    wp_nav_menu( array( 
		'theme_location' => 'menu-footer', 
		'container_class' => 'custom-menu-class' ) ); 
	 ?>
      </div>
    </div>
</footer><!-- #colophon -->

Important, bien reporter l’identifiant du menu dans l’attribut “theme_location”.

Voyons ce que ça donne (sans CSS)

Apparence menu frontend

Apparence menu frontend

Maintenant, à vous de jouer pour la mise en forme du menu !