Navigation
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • #1356970
    Smarticle
    Participant

    My menu and sub-menus are almost right. I just need a bit of help with the finishing touches…

    1. On the Desktop Menu…
    I need the

      current

    sub-menu item to remain rgb(120, 184, 42), so that it indicates to the user that they are on the respective page.

    2. One the Mobile Menu…
    I need the primary menu items to behave in the same way as they do on the desktop menu, i.e. hover with rgb(120, 184, 42) text and rgb(0, 0, 0) background. The sub-menus already have the rgb(0, 0, 0) but I’d like the text to become rgb(120, 184, 42) on hover.

    Thanks

    P.S. Full login detail for https://cotconference.wpengine.com/ in the next post.

    #1356972
    Smarticle
    Participant
    This reply has been marked as private.
    #1357362
    Nabeel A
    Moderator

    Hi there,

    Thanks for writing in! Please add the following code in your Customizer via Appearance > Customize > Custom > Edit Global CSS:

    @media screen and (max-width: 979px){
    .sub-menu li:hover a {
        color: rgb(120, 184, 42) !important;
    }
    }

    Let us know how this goes!

    #1359385
    Smarticle
    Participant

    Hi there,

    2 issues…

    Issue 1:
    You only addressed one of the problems from my original post. Please check part 2 (above) regarding the Mobile Menu.

    Issue 2:
    I think you misunderstood. That looks like you’ve given me code to style the hover colour. But I had that. I was/am already happy with my hover colour, which is rgb(120, 184, 42). However, I’m not happy with the colour of the sub-menu text when a user is already on an actual sub-menu page. If they then start navigating through the sub-menus and happen to display the title of the page they’re already on, there is currently nothing to highlight they are already on that page. It currently remains black (and obviously goes rgb(120, 184, 42) on hover)… but it shouldn’t have a hover state if it’s the page they’re already on. So I’m hoping you can provide code to keep the current page sub-menu item rgb(120, 184, 42).

    P.S. This website is about to go live, i.e. it’s about to move from the dev site [cotconference.wpengine.com] and go live @ cotannualconference.org.uk. So if you can’t access it for any reason, please try that URL. If necessary, I’ll update your login details and add them in a private posts below.

    #1359432
    Christopher
    Moderator

    Hi there,

    Please add following code as well:

    body li.current-menu-ancestor > a {
        background: rgb(0,0,0);
        color: rgb(120,184,42) !IMPORTANT;
    }
    .sub-menu .current-menu-item a span {
        color: rgb(120,184,42);
    }
    

    Hope it helps.

  • <script> jQuery(function($){ $("#no-reply-1356970 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>