problem getting single post to appear with correct menu styling

  • Resolved keyaspects

    (@keyaspects)


    13 years, 9 months ago

    Hi.

    I have a basic 4 stage menu. Home, About, Events, Contact
    A blue line under menu name dictates which page you are currently on.

    The Events is actually a category and I have added this to the wp3 menu system in the admin area.

    All menus work fine and display a blue line under each one when you are on that particular page.

    On the home page I display 1 recent post from the events page in the sidebar.

    However if I click on this post and display the most recent post. The Events menu title does not have the blue line under it.

    I’m sure I’m missing something simple here as when I then click the events tab in the menu the blue line appears.

    I want the blue line to appear when viewing single posts from this category.

    Many thanks

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter keyaspects

    (@keyaspects)

    any ideas anyone? Thanks in advance. Here’s the code in the side bar that I’m using.

    [Code moderated as per the Forum Rules. Please use the pastebin]

    However I’m not using any template for the single.php, just the standard single.php file

    Thread Starter keyaspects

    (@keyaspects)

    code via pastbin as per forum rules:
    https://pastebin.com/8vcZCydL

    Thread Starter keyaspects

    (@keyaspects)

    Solved, if anyone else out there is trying to get the same thing to happen.

    I needed to add the following to my CSS.
    .current-post-ancestor { }
    and
    .current-post-ancestor a { }

    With the same styles I was using for:
    .current-menu-item { }
    and
    .current-menu-item a { }

    Explained below:

    .current-menu-item { } targets only the menu item the visitor pressed to get to the menu. This goes for categories as well as pages.

    .current-page-item { } targets only the current menu item if that menu item is pointing to a page and the visitor is on that page.

    .menu-item-home { } targets only the menu item that points to the root or home page of the site.

    .current-post-ancestor { } targets the menu item as long as the category the menu item points at is an ancestor of the post (so regardless of whether the post is in the category or in a sub-category under the category)

    .current-menu-parent { } targets the menu item if it is the parent of the menu to which the post belongs (yes, it’s confusing).

    .current-post-parent { } targets the menu item only if the category is the direct parent of the post (menu item will not be highlighted if the post only belongs to a category that is a child of the category the menu item points to).

    Taken from comments on the following post https://www.webcitizenmag.com/2010/05/23/how-to-highlight-current-category-in-wordpress-menu-for-single-post-pages-using-jquery/

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘problem getting single post to appear with correct menu styling’ is closed to new replies.