Top level menu highlighting
-
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:
- Home (custom link)
- Page 1
- Cat 1
- Cat 2
- Cat 3
- Page 2
- 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…
-
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.
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.
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
The topic ‘Top level menu highlighting’ is closed to new replies.