Sous-menu wordPress avec un parent non-cliquable

Il y a 2 méthodes pour ajouter un menu dans wordPress. On utilise soit la page nav-menus accessible dans le backend par Apparence ⇒ Menus, soit la personnalisation du thème Apparence ⇒ Personnaliser et Menus. On peut créer et ajouter des liens vers des pages, des articles, des catégories … et des liens personnalisés. En déplaçant un lien, on peut le mettre en sous-menu d’un autre lien.

Sous-menu wordPress
Sous-menu wordPress

Mais seulement, chaque lien parent est cliquable. Les liens des sous-menus apparaissent lorsque la souris est au-dessus du lien parent. On ne peut créer de lien personnalisé qu’en renseignant l’adresse web du lien. L’astuce revient à indiquer le hashtag # comme adresse web.

Création d'un lien personnalisé
Création d’un lien personnalisé
Lien site web: #
Lien site web: #
Structure du menu et sous-menus
Structure du menu et sous-menus

Le lien hashtag est une ancre. Le lien <a href="#maDiv">Mon Lien</a> dirigera vers la partie de la page contenant <div id="maDiv">…</div>. Si l’on met seulement <a href="#">Mon Lien</a>, le lien dirigera vers le haut de la page. Ce n’est pas ce que l’on veut, d’autant plus que lorsque la souris passera au-dessus du lien, le pointeur prendra la forme d’une main avec l’index levé, symbole d’un lien.

Pour éviter cela et désactiver le lien vers le haut de la page, on va supprimer l’attribut href dans functions.php du thème.

Il faut aussi changer l’aspect du curseur dans les styles du thème, sinon on se retrouvera avec un pointeur de souris en forme de sélection de texte.

Et hop, on a la possibilité de créer des sous-menus avec un lien parent non-cliquable.

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *