This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

highlight Parent Menu Item when on child post

  • Creator
  • #9005

    All research has pointed back to the theme for answers. We have a typical nav via wp custom menus containing parent pages and child pages / posts. We have each individual page/post menu item appearance changed via the ubiquitous “.current-menu-item” (for other users’ ref: in BC’s case it’s #access li.current-menu-item ). BUT how do we call the parent when on a child page or post? Here’s what the ‘nets say and they are wrong:

    #access li.current-menu-parent,
    #access li.current_page_parent,
    #access li.current_page_ancestor,
    #access li.current-menu-ancestor { stuff:wouldbehereabut; dang: nothing-above-works !totallyimportant; }


Viewing 4 replies - 1 through 4 (of 4 total)
  • Author
  • #9020
    Jason Bobich


    You need to style the anchor tag within the list item, which is the actual button, in this case. And you need to make sure you’re targeting only the first one so it doesn’t trickle down to all anchor tags within the list item (i.e. the current drop down menu’s buttons).

    Taking these two things into account, it should look something like this:

    #access li.current-menu-parent > a { ... }

    Thx for the reply – both #access li.current-menu-item (and/or with its anchor > a) { … } work as intended, but #access li.current-menu-parent (and/or with its anchor > a) { … } don’t.

    example – note that the child on the left is fine, the parent does nothing

    Jason Bobich

    These classes work with the parent menu items of the menu you’ve setup, but you’re trying to communicate two different menus entirely.

    If you’ve never used an inspector like Firebug or Google Chrome’s inspector, you should definitely look into that. You can quickly see what classes are available to you for styling and that’ll make life much easier.

    For example, in your case, you can quickly see what you have to work with and why the classes you’re trying aren’t working:

    The only way I can think of to do this with how you’re setting things up is to manually style the different scenarios.

    Take the “Programs” set of pages for example: #access,
    body.postid-333 #access
    body.postid-334 #access
    body.postid-335 #access
    body.postid-336 #access
    body.postid-337 #access {

    I use Chrome and was trying to avoid id by id, but thank you.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The forum ‘Barely Corporate Responsive WordPress Theme’ is closed to new topics and replies.