WordPress propose un nombre apparemment infini d’options de personnalisation pour votre site Web. Cependant, trouver comment appliquer certains d’entre eux peut ne pas être immédiatement évident. Un exemple subtil consiste à ajouter un titre dans votre menu sans lien vers une page.
Heureusement, ce processus peut être rapide et facile. En ajustant quelques options et en ajoutant du CSS à votre site, vous pouvez incorporer des titres dans votre menu WordPress sans ajouter de liens pour les accompagner.
Dans ce didacticiel, je couvrirai certaines des raisons pour lesquelles vous voudrez peut-être ajouter un titre non cliquable à votre menu WordPress, puis je vous expliquerai trois étapes simples pour en configurer un. Allons-y!
Pourquoi ajouter un titre dans un menu WordPress sans lien vers une page
Les menus visent principalement à rendre votre site facile à naviguer. Ajouter un titre sans lien peut sembler contre-productif, mais cela peut être un outil d’organisation utile qui permet à vos utilisateurs de trouver rapidement les informations dont ils ont besoin.
Une application majeure de ceci est l’utilisation d’un élément de menu non lié pour catégoriser les sous-éléments qui ont des liens. Par exemple, voici un titre parent nommé Nous contacter qui n’a de lien nulle part :
Au lieu, Nous contacter agit comme un élément parent pour les éléments enfants fonctionnels que les utilisateurs peuvent contacter par e-mail, par téléphone ou en se rendant dans un emplacement physique. De cette façon, les visiteurs peuvent accéder directement à leur méthode de contact préférée au lieu de cliquer sur un lien vers une page de contact et de faire défiler toutes les options.
Les titres de menu non liés peuvent également être utiles si vous cherchez à afficher un message statique de manière cohérente sur votre site. Même si cette méthode fera le travail, vous pourriez être mieux servi en ajoutant un code d’en-tête ou de pied de page personnalisé si tel est votre objectif.
Comment ajouter des titres dans un menu sans lien vers une page (en 3 étapes)
Ajouter des titres à un menu WordPress sans lien vers une page peut être une touche subtile et professionnelle. Heureusement, c’est un processus facile. Une fois que vous connaissez les étapes, vous pourrez ajouter rapidement des titres de menu non liés là où vous en avez besoin.
Étape 1 : Sélectionnez ou créez un menu
La première chose à faire est de créer ou de modifier le menu auquel vous souhaitez ajouter un titre non lié.
Vous pouvez commencer par naviguer vers Apparence > Menus dans la barre latérale de votre tableau de bord WordPress. Cela vous amènera à l’écran suivant :
À partir de là, votre menu actuel devrait déjà être à l’écran si vous en avez un. Si vous voulez repartir de zéro, cliquez sur créer un nouveau menu au lieu.
Étape 2 : ajouter un lien personnalisé
Maintenant que vous avez sélectionné le menu sur lequel vous allez travailler, vous pouvez commencer à créer votre titre de menu non lié.
Naviguez vers le Ajouter des éléments de menu panneau sur le côté gauche de l’écran et ouvrez le Liens personnalisés onglet pour développer les options :
Cela affichera deux champs : URL et Texte du lien. Pour rendre le lien non cliquable, entrez simplement # dans le URL boîte.
Ensuite, tapez votre titre non lié dans le champ Texte du lien champ. Dans cet exemple, j’ai choisi d’utiliser le Nous contacter étiqueter.
Lorsque vous avez terminé, cliquez sur Ajouter au menu. Vous pouvez ajouter des sous-éléments avec des liens sous ce titre si vous le souhaitez, et faire glisser et déposer des éléments de menu pour les organiser.
Étape 3 : utilisez CSS pour empêcher le curseur de changer au survol
Les deux premières étapes vous ont aidé à créer un élément de menu qui ne renvoie pas à une page. Cependant, les utilisateurs qui survolent celui-ci verront toujours leurs curseurs changer comme s’ils pouvaient cliquer dessus. Comme cela ne mènera nulle part, vous voudrez peut-être modifier le curseur par souci de cohérence.
Heureusement, cela peut facilement être fait avec un peu de CSS.
Dans le Menus l’écran, accédez au coin supérieur droit et cliquez sur le Options d’écran menu déroulant. Cela vous présentera quelques options. Trouvez celui étiqueté Cours CSS:
Cochez cette case et fermez le Options d’écran menu.
Ensuite, faites défiler vers le bas jusqu’au menu de votre site Web. Recherchez le titre que vous avez créé plus tôt et qui n’a pas de lien.
Il devrait maintenant y avoir un champ supplémentaire en dessous intitulé Classes CSS (facultatif).
Entrez une classe CSS personnalisée pour correspondre au changement de curseur (le code CSS sera ajouté ensuite). j’ai utilisé non cliquable ici pour faire simple :
Une fois que vous avez choisi un cours, enregistrez vos paramètres.
Ensuite, ouvrez WordPress Customizer en accédant à Apparence > Personnaliser dans le menu de la barre latérale.
Une fois que vous y êtes, accédez au CSS supplémentaire onglet en bas du menu à gauche. Copiez et collez le code suivant :
.unclickable > a {
pointer-events: none;
}La seule exception ici est si vous avez utilisé une classe autre que non cliquable plus tôt. Si vous l’avez fait, remplacez simplement cette ligne par le nom que vous avez donné à la classe CSS.
Votre champ CSS devrait alors ressembler à ceci :
Le changement devrait être reflété dès que vous avez entré le CSS supplémentaire.
Vérifiez que votre curseur ne vous donne pas la possibilité de cliquer lorsque vous survolez votre élément de menu non lié. Une fois que vous êtes satisfait que les modifications que vous avez apportées ont été mises en œuvre, cliquez sur Publier pour enregistrer les paramètres.
Une fois ces étapes terminées, vous devriez avoir ajouté un titre à votre menu sans le lier à une page ni le rendre cliquable du tout.
Conclusion
Comprendre comment ajouter un titre à votre menu WordPress sans le lier à une page peut être un peu déroutant au début. Heureusement, avec un peu de conseils, vous pouvez naviguer facilement dans le processus.
Dans cet article, j’ai couvert trois étapes simples pour ajouter un titre non lié à votre menu WordPress :
- Créez ou sélectionnez le menu que vous souhaitez utiliser
- Ajouter un nouvel élément de menu Lien personnalisé
- Appliquez quelques lignes de CSS pour que le curseur soit par défaut un pointeur au survol
Quelle option de menu non liée allez-vous créer avec ce didacticiel ? Faites-nous savoir dans la section commentaires ci-dessous!
