WordPress : Comment mettre en surbrillance la page en cours dans le menu de navigation ?

Publié par Jean-Michel le

Je suis en train de personnaliser un thème WordPress pour mon école, et je suis un peu agacé par le fait que la page en cours dans le menu de navigation n’est pas indiquée.

Par exemple:

entrez la description de l'image ici

Vous pouvez clairement voir que je survole une page dans le menu de navigation et que la page sur laquelle je survole est mise en surbrillance, comme prévu.

Lire également:  Conversion de HTML en WordPress mais CSS ne sort pas

Cependant, la page sur laquelle je suis actuellement, appelée « Arhiva », n’est pas mise en évidence, et je pense que cela peut être quelque peu déroutant.

Je ne veux pas que la page actuelle et la page survolée par la souris soient surlignées de la même manière. Je pense qu’un texte d’entrée en gras dans le menu de navigation ferait parfaitement l’affaire pour séparer la page actuelle des autres pages.

Lire également:  Wordpress : Comment puis-je obtenir le nom de la page actuelle dans WordPress ?

Comment puis-je atteindre cet objectif?

Le CSS actuel du thème peut être consulté ici : http://petagimnazija.hr/wp/wp-content/themes/chiron/style.css.

Solution n°1 trouvée

Le système de menus de navigation ajoute de nombreuses classes, y compris la correspondance de la page actuelle (plutôt intelligemment, il essaiera même de détecter les URL personnalisées, qui ont été saisies explicitement).

Lire également:  Wordpress : Comment implémenter le code du widget bootstrap pour l'en-tête personnalisé dans WordPress ?

La classe la plus simple à utiliser est current-menu-item, mais il y en a plusieurs autres traitant des parents/ancêtres et plus encore.

Le Codex les a documentés dans wp_nav_menu()> Classes CSS des éléments de menu.

Catégories : Wordpress

Jean-Michel

Jean-Michel est en charge de la partie blog du site. Il met en place la stratégie de contenu et répond aux questions fréquentes sur Wordpress.

0 commentaire

Laisser un commentaire

Avatar placeholder

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