Highlight ancestor AND current menu item at the same time

  • Sorry if this is too dumb of a question, BUT…!

    Re-reading the wonderful Dynamic Menu Highlighting Codex article, but I still cannot figure this one out.

    I have a horizontal top menu . The usual:
    About Gallery Products Contact .
    The sidebar menu is basically showing the subpages of these.
    I have highlighted the curent-menu-item for each.

    Let’s say, the top menu current item is RED, and the sidebar current menu item is BLUE.

    QUESTION:
    How do i manage to highlight BOTH the top menu current item AND the sidebar menu current item at the same time?

    Now, if i go to “Products” in the top menu, it’s highlighted (RED), but if i click on the sidebar item “Books”, or “Pencils”, they become highlighted (BLUE) but the Products (RED) is not highlighted anymore…

    I know that the answer is somewhere in the conditional tags,that would say, “if the page is “Cars” AND is child of “Products” use .current_menu_item on both”, or something similar.

    but i cannot figure it out …

    Thanks a lot!

Viewing 8 replies - 1 through 8 (of 8 total)

  • What are you using to create each menu? wp_nav_menu() will output the appropriate classes in the top menu for you to target using CSS.

    Thread Starter komiska

    (@komiska)

    Yes, i have to use the wp_nav_menu(), because the client needs to be able to change the menu items as he pleases.
    I know that there are classes liek .current_menu_item, current_menu_item ancestor and what else, but i cannot figure out how to use them to highlight BOTH menus at the same time – the top adn the sidebar menu, because they have a different CSS when highlighted.

    You create CSS rules for each menu with the same properties for background or color etc.

    Thread Starter komiska

    (@komiska)

    Thanks or your feedback!
    I guess, I have not made my question clear enough.
    Or maybe I am agonizing over a tiny, simple solution ??
    I will try and figure it out. When I come up with something , I’ll post.
    Thanks again!

    Thread Starter komiska

    (@komiska)

    I have found the answer ( thank you, Firebug developers!)
    The horizontal/top menu had a WP class of “.current-page-ancestor” and the sidebar menu items got the WordPress class of “.current_page_parent” so it was easy to add the CSS styles to each, regardless the menu items defined by the client.

    Thanks again for the feedback ! ??

    Thread Starter komiska

    (@komiska)

    Hello, again!
    I have (not so elegantly*) solved the above, but now,
    I have another question:
    Why is the “current_menu_item” or “current_page_link” or similar NOT generated in the SECOND li :

    https://mariusschwemmer.de/kalender/campus-3/

    If I click on to “Kalendarium” – the “current link” ( well all of them – get highlighted.
    If I click on “Campus” – Firebug does not show me any “current-menu-item” – there is nothing i could style.

    How did this happen? What did I do wrong?

    (*I’d love actually to highlight ONLY the LI + the current UL LI at the same time, not all of them, but did not really succeed )

    Wakkos

    (@wakkos)

    I have same problem: 2 menus and second menu doesn’t show the “current-menu-item” class.

    The first menu didn’t show either with:
    <?php wp_nav_menu (array ( 'theme_location' => 'sidebar-menu', 'container' => 'nav' ) ); ?>

    But I removed the container option and it worked:

    <nav>
<?php wp_nav_menu (array ( 'theme_location' => 'sidebar-menu' ) ); ?>
</nav>

    But it doesn’t work in the second menu (not secondary xD) either with or without the container option:

    <?php wp_nav_menu (array ( 'theme_location' => 'main-nav-menu') ); ?>

    An extended search has been made! =(

    Thread Starter komiska

    (@komiska)

    Hello! Has anyone found out WHY WordPress won’t add the “current-menu-item” class?
    Any solutions?
    Need help, client unhappy, still unsolved :/

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Highlight ancestor AND current menu item at the same time’ is closed to new replies.