WordPress.org

Ready to get started?Download WordPress

Forums

Top level menu highlighting (4 posts)

  1. flightpath59
    Member
    Posted 3 years ago #

    I'm using wp-nav-menu to display a menu, but I'm not getting all the classes that I should be (or at least think I should be - maybe I'm missing something). It looks like this:

    1. Home (custom link)
    2. Page 1
      • Cat 1
      • Cat 2
      • Cat 3
    3. Page 2
    4. Page 3

    When I'm on a page, its menu item has class="current-menu-item current_page_item" as expected, but on the home page I don't get any such classes.

    Then, when I'm on a category page, the Page 1 menu item has class="current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor" as expected, but when I'm on a single post it doesn't have any of them.

    Any ideas how/why this is happening? Surely Page 1 is still a menu and/or page ancestor of a post in any of the categories 1, 2 or 3, no?

    Please help...

  2. Kapil Chugh
    Member
    Posted 3 years ago #

    Are you using wp_nav_menu or wp-nav-menu?

    If you are using wordpress's wp_nav_menu function then send us the code how you are calling it and pls share your website link also.

  3. flightpath59
    Member
    Posted 3 years ago #

    Good point. The menu is registered in functions.php using:

    register_nav_menus( array(
    		'primary' => __( 'Primary Navigation', 'my-site' ),
    	) );

    then I'm calling it like this in header.php:

    wp_nav_menu( array( 'container_class' => 'menu-header', 'theme_location' => 'primary' ) );

    I can't give you a link to the site because it's a password protected dev subdomain. The client's very firm on that, sorry.

  4. postrophe
    Member
    Posted 3 years ago #

    Hi,

    I use the Thesis Theme. Currently there are ( "current background color" and "current parent background color" ) that works with Thesis 1.8 menu and WP-menu(3.x) for the top level Tabs

    For my test site I have achived that using the " WordPress(3x) nav menu " and 6 lines of CSS.

    First (1) level highlighting ( white ). Second (2) level highlighting ( yellow ). Third (3) level highlighting ( orange )

    1 - Highlighting the ( top categories Tabs ) while on a "single post" of my top categories.

    .current-post-ancestor a {background: #FFFFFF;border-bottom-color:#FFFFFF;}

    2a - Highlighting the ( subcategories ) while on a "single post" of my child/subcategories.

    .sub-menu .current-post-ancestor a {background:#F0EEC2;}

    2b - Highlighting the ( parents and child/subcategories ) while on a child/subcategories. ( need to define a category for the appropriate posts )

    .cat_galerie-2010 .current-menu-parent a {background:#F0EEC2;}
    .cat_galerie_2011 .current-menu-parent a {background:#F0EEC2;}

    3 - Highlighting the ( parents and child/subcategories ) while on a "single post" of my child/subcategories. ( need to define a "CSS Class" (post edit) for the appropriate posts ) - here I target a "CSS Class" and it's appropriate menu-item created by WordPress )

    .postgalerie2010 .menu-item-776 a {background:#FFD596;}
    .postgalerie2011 .menu-item-785 a {background:#FFD596;}

    This does not play well with IE.

    Hope that will help you.

    Pierre

Topic Closed

This topic has been closed to new replies.

About this Topic