Sommaire
Voulez-vous ajouter des descriptions à vos menus WordPress ? Cela semble être une fonctionnalité de base que WordPress devrait prendre en charge et c’est le cas, mais elle est assez délicate à activer. Pour commencer, vous verrez cette fonctionnalité disponible sur la page du menu, mais l’activer ne fonctionne pas.
C’est parce que la fonctionnalité est désactivée par défaut, ce qui n’a pas beaucoup de sens.
Mais ne vous inquiétez pas, vous pouvez l’activer. Toutefois, cela peut s’avérer difficile en fonction de la méthode que vous choisissez. Vous pouvez soit utiliser un plugin, soit écrire du code pour obtenir les mêmes résultats. La méthode de codage demande un peu plus de travail que le plugin, mais elle vous évite d’installer un autre plugin.
Aujourd’hui, je vais vous montrer comment ajouter des descriptions de menu pour n’importe quel thème en utilisant deux méthodes.
Les descriptions de menu sont des descriptions de votre menu, comme le nom l’indique, mais vous vous grattez peut-être encore la tête. Après tout, peu de sites Web les utilisent.
Le menu est en place pour aider vos visiteurs à naviguer sur votre site Web. Ainsi, les visiteurs peuvent naviguer plus facilement sur votre site Web et trouver ce qu’ils recherchent. Cependant, il arrive que les éléments du menu ne soient pas très clairs.
Dans ces cas, ils peuvent dérouter le visiteur, ce qui sape l’intérêt d’un menu. Heureusement, on peut éviter cela en ajoutant des descriptions de menu.
Cependant, certains webistes utilisent délibérément des noms déroutants dans leurs menus pour les rendre plus uniques.
Les gens sont pleins de curiosité et s’ils voient un nom accrocheur ou quelque chose dont ils ne savent rien, ils cliqueront probablement dessus. Bien sûr, l’inverse est également vrai, et si quelqu’un ne connaît pas quelque chose, il aura tendance à l’éviter.
Il est très important de comprendre votre public et les descriptions de menu ne sont pas nécessaires pour chaque élément. Par exemple, de nombreux sites Web d’entreprise comportent un élément de menu intitulé “Services”, mais cela peut ne pas être clair pour tout le monde. L’ajout d’une courte description le rendra probablement très clair.
Méthode 1 : Max Mega Menu
La première méthode que je vais décrire implique l’utilisation du plugin Max Mega Menu. Je recommande fortement cette approche si vous n’êtes pas à l’aise avec le codage. Ce plugin vous permet d’ajouter des descriptions sur n’importe quel menu de votre site web.
Note :N’oubliez pas que si vous n’avez pas déjà mis en place un menu, ce tutoriel ne vous apportera rien.
Commençons par cliquer sur Plugins et sélectionner l’option Ajouter un nouveau dans le panneau d’administration de gauche.
Recherchez Max Mega Menu dans la boîte de recherche disponible. Vous obtiendrez des plugins supplémentaires qui pourraient vous être utiles.
Faites défiler vers le bas jusqu’à ce que vous trouviez le plugin Max Mega Menu et cliquez sur le bouton “Installer maintenant” et activez le plugin pour l’utiliser.
Une fois l’installation terminée, vous êtes prêt à commencer. Heureusement, ce plugin est assez facile à configurer.
Dans le panneau d’administration de gauche, cliquez sur Mega Menu et sélectionnez l’option General Settings. Vous accéderez ainsi à la page principale des paramètres du plugin.
Examinez tous les éléments de la page et trouvez l’option “Descriptions des éléments de menu”. Ici, vous pouvez activer ou désactiver les descriptions. Assurez-vous que l’option “Activé” est sélectionnée et cliquez sur le bouton “Enregistrer les modifications”.
Cette opération permet d’activer les descriptions de menu sur votre site Web, mais n’oubliez pas que les options de formatage sont très limitées. Vous devez maintenant ajouter les descriptions de menu. Dans le panneau d’administration de gauche, cliquez sur Apparence et sélectionnez l’option Menus.
C’est ici que se trouvent tous les paramètres du menu. Sur le côté gauche de la page, vous devriez voir une case ou une option “Max Mega Menu Settings”. Cochez la case “Activer” et cliquez sur le bouton “Enregistrer”. Cela permettra au plugin de fonctionner.
Tout ce qu’il reste à faire est d’ajouter la description du menu. En haut de l’écran, vous devriez voir une liste déroulante Screen Options. Cliquez dessus et cochez la case des descriptions. Si vous ne le faites pas, vous ne verrez pas d’option pour saisir la description. Cliquez maintenant sur l’élément de menu auquel vous souhaitez ajouter une description et tapez-la dans la case correspondante. Cliquez sur le bouton “Enregistrer le menu” pour sauvegarder votre travail. Vous pouvez maintenant afficher la description du menu sur votre site Web.
Félicitations, vous pouvez maintenant ajouter une description à chaque élément de menu sur votre site Web. N’oubliez pas que la description doit être aussi courte que possible. Quelques mots tout au plus.
Méthode 2 : Codage
Cette méthode nécessite la modification de plusieurs fichiers, mais elle n’est pas trop compliquée. Avant de commencer, assurez-vous de créer une sauvegarde de votre site Web et d’avoir accès à votre cPanel. L’accès vous est donné par votre hébergeur lorsque vous créez un compte.
Trouver Functions.php
Commençons par nous connecter au cPanel et cliquer sur l’option File Manager. Le gestionnaire de fichiers vous permettra d’accéder à tous les fichiers liés à votre site web.
Vous devez localiser le fichier functions.php de votre thème. Cliquez sur le répertoire public_html, puis sur le dossier wp-content. Dans ce dossier, vous trouverez tout le contenu lié à votre site Web. Cliquez sur le dossier themes et entrez le dossier du thème que vous utilisez actuellement. Enfin, faites un clic droit sur le fichier functions.php et sélectionnez l’option Editer.
Une fenêtre pop-up va s’afficher. Cette fenêtre vous demandera de créer une sauvegarde de vos fichiers avant de modifier quoi que ce soit. Cela vous permettra de revenir à l’état initial de votre site Web si quelque chose ne va pas. Cliquez sur le bouton “Modifier”. Un nouvel onglet s’ouvre contenant tout le code du fichier.
Vous devez coller le code suivant dans le fichier functions.php :
function start_el(&$output, $item, $depth, $args) {
global $wp_query ;
$indent = ( $depth ) ? str_repeat( “t”, $depth ) : ” ;
$class_names = $value = ” ;
$classes = empty( $item-classes ) ? array() : (array) $item-classes ;
$class_names = join( ‘ ‘, apply_filters( ‘nav_menu_css_class’, array_filter( $classes ), $item ) ) ;
$class_names = ‘ class=”‘ . esc_attr( $class_names ) . ‘”‘ ;
$output .= $indent . ‘li id=””menu-item-‘.” $item-=””ID . ‘”” . $value . $class_names . ” ;
p
$attributes = ! empty( $item-attr_title ) ? ‘ title=”‘ . esc_attr( $item-attr_title ) .'”‘ : ” ;
$attributes .= ! empty( $item-target ) ? ‘ target=”‘ . esc_attr( $item-target ) .'”‘ : ” ;
$attributs .= ! empty( $item-xfn ) ? ‘ rel=”‘ . esc_attr( $item-xfn ) .'”‘ : ” ;
$attributs .= ! empty( $item-url ) ? ‘ href=”‘ . esc_attr( $item-url ) .'”‘ : ” ;
$item_output = $args-before ;
$item_output .= ‘a’. $attributs=”” . ‘=””‘ ;
/a’.
$item_output .= $args-link_before . apply_filters( ‘the_title’, $item-title, $item-ID ) . $args-lien_après ;
$item_output .= ‘span class=””sub””‘ . $item-description . ‘/span’;
$item_output .= ‘’;
$item_output .= $args-after;
$output .= apply_filters( ‘walker_nav_menu_start_el’, $item_output, $item, $depth, $args );
The Walker Nav code will add the functionality to display menu descriptions to your theme.
Once you have inserted the code into the functions.php file, click on the “Save Changes” button to finish.
With the functionality added, it is time to enable it. This part is theme dependent. You need to locate the wp_nav_menu() function. This is typically located in your header.php file, but can be located elsewhere on different themes. Edit the function to look like the following:[ht_message mstyle=”info” title=”” show_icon=”” id=”” class=”” style=”” ]!–?php $walker = new Menu_With_Description; ?–
!–?php wp_nav_menu( array( ‘theme_location’ =– ‘primary’, ‘menu_class’ = ‘nav-menu’, ‘walker’ = $walker ) ); ?
Save your work.
Now comes the tricky part of styling.
Once the above line is added you are ready to start adding descriptions. Here is an example of what a description looks like in code form:[ht_message mstyle=”info” title=”” show_icon=”” id=”” class=”” style=”” ]/lili id=””menu-item”” class=””menu-item” menu-item-type-post_type=”” menu-item-object-page”=””a href=””https://www.MyExampleWebsite.com/Home/””Homespan class=””sub””This is a test./span/a/li
p
Congratulations, you have successfully added menu descriptions to your website. If anything confuses you in this method, I would recommend using the plugin method.
Les menus sont là pour aider les visiteurs à naviguer sur votre site Web. Quelques mots supplémentaires comme une description aideront à rendre tous les éléments de votre menu plus faciles à comprendre. C’est important pour les visiteurs qui pourraient ne pas savoir de quoi traite votre site Web ou si votre site est différent des autres. Faites savoir aux gens ce qui est différent et en quoi cela les concerne.
Quelle méthode avez-vous choisi d’utiliser ? Combien de fois choisissez-vous une méthode de plugin plutôt qu’une méthode de codage ?