Voulez-vous mettre en surbrillance la page actuelle dans le menu de navigation ou le menu latéral ? La mise en surbrillance de la page actuelle facilite la navigation.
Les fonctions de menu WordPress (wp_nav_menu, wp_list_pages) ajoutent automatiquement la classe current_page_item à la balise li contenant le lien actif. Il suffit donc d'utiliser la même classe pour mettre en surbrillance la page actuelle.
Instructions :
Il vous suffit d'ajouter ce code au fichier style.css de votre thème :
/* Highlight using list element */
li.current_page_item{
background:#999;
color:#fff;
}
/* Highlight using link element */
li.current_page_item a{
text-decoration:underline;
background:#666;
}
Remarque : Si c'est la première fois que vous ajoutez des extraits de code dans WordPress, veuillez consulter notre guide sur comment copier / coller correctement des extraits de code dans WordPress, afin de ne pas casser accidentellement votre site.
Si vous avez apprécié cet extrait de code, veuillez envisager de consulter nos autres articles sur le site comme : Meilleurs constructeurs de pages WordPress (comparés).
où puis-je trouver le « fichier style.css du thème » sur la version gratuite de WordPress ?
Merci. J'ai cherché à plusieurs endroits, mais votre solution a fonctionné. Je vous en remercie beaucoup !
Salut Robert, content que notre solution ait fonctionné pour vous.
Suivez-nous sur Facebook et Twitter pour d'autres guides intéressants. 🙂
Ça marche, merci !
Ce code fonctionne si le menu a une seule catégorie. Sinon, il met en surbrillance le lien de premier niveau et toutes les sous-catégories qu'il contient.
Par exemple, vous seriez à "accueil>à propos>actualités" et il mettrait en surbrillance toutes les catégories "accueil" au lieu de seulement "actualités".
Mon thème ajoute la classe CSS `.current-menu-item`.
Cela peut varier en fonction du thème, mais le processus reste le même.
fonctionne à merveille et m'a fait gagner un temps précieux. Merci
Merci beaucoup !!!!
Bonjour monsieur, c'est bien mais je veux changer la couleur du lien et non la couleur de fond, s'il vous plaît aidez-moi
La couleur serait contrôlée par la propriété
color, par exemple :li.current_page_item a{ color:#666; }
Je pense que vous n'avez qu'à ajouter cela à votre CSS et non à la page functions.php. Cela a très bien fonctionné dans mon CSS.
Merci
Merci, l'extrait a maintenant été mis à jour.