WordPress.org

Ready to get started?Download WordPress

Forums

Highlight menu item for blog entries? (10 posts)

  1. Design Wave
    Member
    Posted 3 years ago #

    Hello everyone!

    I'm using a WordPress blog, and it is my home page - named "News".
    I've got couple of entries in my blog - some news.
    Also I've got other pages and items in my main menu, e.g. "About", "Contacts", etc.
    The thing is when I press menu item, I've got current menu item highlighted,
    with .current-menu-item class it is easy to customize.
    Also I can highlight main menu item when pressing submenu items,
    using .current-menu-ancestor class.
    But what I need is to highlight menu item "News", when I press and read a blog post.
    I was looking for an easy solution, couldn't find it. Is there any?
    I think there must be a default solution for a blog engine.

    Thanks for replies!

  2. Chip Bennett
    Theme Review Admin
    Posted 3 years ago #

    Is "News" a Category?

    If so, give this a try. I use it to add a "current-cat" class to menu items:

    http://wordpress.pastebin.com/gyqS6TfJ

  3. Design Wave
    Member
    Posted 3 years ago #

    Thank you for reply!

    No "News" is not a Category, it is title for Blog,
    like on the top-menu of this page (next to Forums).
    By the way, here it is working properly as it should.

  4. Chip Bennett
    Theme Review Admin
    Posted 3 years ago #

    Can you provide a link to your site, so I can visualize what you're describing?

  5. zeaks
    Member
    Posted 3 years ago #

    I was trying to do this too and never figured it out

  6. Chip Bennett
    Theme Review Admin
    Posted 3 years ago #

    Try styling the following CSS classes (assuming your Theme adds the body_class() template tag to the BODY tag, and assuming that your navigation menu UL tag has an ID of #nav):

    body.blog #nav li.current_page_item {
         /* CSS definitions for current page list item go here */
    }
    body.blog #nav li.current_page_item a {
         /* CSS definitions for current page list item link go here */
    }
  7. Design Wave
    Member
    Posted 3 years ago #

    Unfortunately, my site is offline. I can't provide a link.
    To visualize what I'm describing, look a this page.
    You can go to Blog (wordpress.org/news) and "Blog" menu item
    will be highlighted in the top menu.
    You can open any blog entry and "Blog" menu item will still be highlighted.
    That is not working by default in any wordpress blog.
    I am looking at Twentyten theme, and still it's not working.
    I was trying to apply .current_page_item class earlier, but no result.
    It is working for pages, not for blog entries.
    I'm curious how they did it here, with .current class for menu links.

  8. Chip Bennett
    Theme Review Admin
    Posted 3 years ago #

    Have you tried applying styles to the "current_page_parent" and "current_page_ancestor" classes?

  9. Design Wave
    Member
    Posted 3 years ago #

    Yes, I did. These classes are not very helpful in this case.
    By the way, I've just looked at your site.
    You've done it by applying id="navhome" to your Blog menu item.
    Can you explain in detail, how you make it work, after pressing blog entry?

  10. Chip Bennett
    Theme Review Admin
    Posted 3 years ago #

    Mine is a hard-coded "home" link, that I put inside the menu UL, before calling wp_list_pages().

    The trick, in this case, is adding an ID to the BODY tag in the appropriate template file (e.g. index.php, or home.php), which can be used to target the specific menu list item.

Topic Closed

This topic has been closed to new replies.

About this Topic