[Résolu] Changement de couleur pour un onglet actif du menu principal, CSS personnalisée (Créer un compte)

  • WordPress :6.4
  • Statut : résolu
7 sujets de 1 à 7 (sur un total de 7)
  • Auteur
    Messages
  • #2474257
    VAGUE DE COM
    Participant
    Initié WordPress
    9 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Version de PHP/MySQL : 7.4.33
    • Thème utilisé : Kadence
    • Extensions en place : Elementor / Wow Plugins
    • Nom de l’hébergeur : OVH
    • Adresse du site : en local

    Problème(s) rencontré(s) :

    Je souhaite changer individuellement la couleur d’un onglet du menu une fois qu’il a été cliqué.
    J’ai réussi à faire le changement de couleur au passage de la souris, mais une fois actif, je n’arrive pas à changer la couleur du background de mon bouton. L’écriture blanche sur fond blanc… forcément, pas lisible. Je souhaite le fond bleu comme au passage.

    J’ai utilisé ce morceau de code dans la CSS personnalisée de mon thème Kadence pour le background « hover ».

    #menu-item-1132:hover
    {
    background-color: #1B75BB;
    }

     

    Je cherche maintenant la solution pour le changement de couleur après avoir cliqué sur le bouton.

    Merci pour votre aide !

     

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2474261
    momofr@free.fr
    Modérateur
    Maître WordPress
    7471 contributions

    Salut, tu as regardé du côté des options de styles du menu principal ?

    C’est dans Apparence -> Personnaliser -> Entête -> sélectionner le widget Navigation principale -> Onglet apparence

    La documentation de ce thème est ici.

    #2474264
    VAGUE DE COM
    Participant
    Initié WordPress
    9 contributions

    Bonjour momofr, merci pour ta réponse.

    J’ai d’abord tenté ta solution, mais sans succès.
    Le souci, c’est que lorsque l’on règle l’apparence de l’en-tête cela s’applique à tous les onglets du menu, sans distinction.
    Exemple : tous avec écriture grise et background blanc.

    D’où ma modification en CSS personnalisée pour le hover des boutons de mon menu, dans un premier temps.
    Mais pas de solution trouvée pour le bouton une fois activée… 🙁

    #2474266
    momofr@free.fr
    Modérateur
    Maître WordPress
    7471 contributions

    Salut, pour cibler les menus via CSS tu dois activer l’option dans les « Options de l’écran -> Afficher les propriétés avancées du menu » de la page de gestion des menus (Apparence -> Menus).

    Tu pourras ainsi ajouter une classe CSS pour chaque menu et définir ensuite leur style selon chaque état (un exemple sur ce site).

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2474269
    VAGUE DE COM
    Participant
    Initié WordPress
    9 contributions

    Ça dépasse mes compétences en CSS mais merci pour la réponse. 😉

    Ton exemple de site est exactement ce que je souhaite réaliser.

    #2474272
    momofr@free.fr
    Modérateur
    Maître WordPress
    7471 contributions
    Cette réponse a été marquée comme privée.
    #2474283
    VAGUE DE COM
    Participant
    Initié WordPress
    9 contributions
    Cette réponse a été marquée comme privée.
7 sujets de 1 à 7 (sur un total de 7)
  • Vous devez être connecté pour répondre à ce sujet.