category menu highlighting for single posts in Eleven40 Pro

Community Forums Forums General Discussion category menu highlighting for single posts in Eleven40 Pro

This topic is: resolved

This topic contains 6 replies, has 2 voices, and was last updated by  braddalton 5 months, 1 week ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #106134

    Jim Colella
    Member
    Post count: 16

    Hi all,

    My request relates to a category-based menu which is in the primary navigation bar, which in Eleven40 Pro sits right below the header. When you select that category from the menu you, of course, have all the relevant posts appearing below and that menu item appears highlighted (in my case, background set to white, when default is grey). All when and good, but when you select a single post, that relevant menu item is not highlighted. I’ve shopped around the ‘Net, and the only piece of coding I’ve come across that isn’t eons old (this one’s from 2010) is here: Dynamic category menu highlighting for single posts

    I’ve followed the instructons to the letter — that is, placed the following in my functions.php:

    //* Highlight single Posts in category menu
    function sgr_show_current_cat_on_single($output) {

    global $post;

    if( is_single() ) {

    $categories = wp_get_post_categories($post->ID);

    foreach( $categories as $catid ) {
    $cat = get_category($catid);
    // Find cat-item-ID in the string
    if(preg_match(‘#cat-item-’ . $cat->cat_ID . ‘#’, $output)) {
    $output = str_replace(‘cat-item-’.$cat->cat_ID, ‘cat-item-’.$cat->cat_ID . ‘ current-cat’, $output);
    }
    }

    }
    return $output;
    }

    //* Filter for single Posts in category menu
    add_filter(‘wp_list_categories’, ‘sgr_show_current_cat_on_single’);

    But then those instructions go on to mention finding the right css selector and adjusting the style relevant to your theme. And yet — using Firebug — I’ve tried every configuration I can think of, none of which work. Can anyone help me out? For starters, this seems like a catch-22, because until I know the right selector, I don’t even know if the code I’ve added to the functions.php is even working.

    FYI, the css code I’ve used for highlighting the menu when the user merely clicks on the menu item is this (ie, not for single posts):

    .genesis-nav-menu a:hover, .eleven40-pro-red .genesis-nav-menu .current-menu-item > a {
    color: #222 !important;
    background: #FFF !important;
    }

    But what is it for the single post item? Presumably it includes “.current-cat” somehow, but I’m stumped!

    Any help is very much appreciated. My site can be viewed at: http://www.turkafile.com

    And, on a final note, by the very nature of the content, I really do need to have a category-based menu. Thanks in advance for any tips, code, or pointers.

    http://www.turkafile.com
    #106212

    braddalton
    Participant
    Post count: 10337

    I think you need to redo your question as its confusing and keep it short and specific to what you actually want.

    The code you pasted is broken as it has been embedded incorrectly and therefore will not be tested.

    Happy to help when i understand what you want.


    #106217

    Jim Colella
    Member
    Post count: 16

    Thanks for the feedback Brad.

    I’ll try again: I have a category-based menu in the primary navigation bar in Eleven40 Pro. When each menu item is selected it is highlighted, or perhaps I should say “active”. But when single posts are selected, they do not “activate” the corresponding menu item. In other words, the category-based URL doesn’t highlight in the menu.

    For example, click on “Hot Topic” in the primary navigation bar, and it’s active/highlighted, like so:

    Category Menu Item

    But when a URL within that category is selected (as a single post), the corresponding menu item is not active/highlighted:

    Category-based URL

    The functions code I used above was copied straight in from the above-mentioned article (Dynamic category menu highlighting for single posts). According tho the comments below it, it seems to work fine for others– although, maybe I accidentally messed with it.

    In any case, if that code isn’t working/is wrong, what do I need to add to my functions.php? And also, what should I put in my child theme css?

    Sorry for the dumbass qu’s. I’m fine with using css — but functions.php is all new to me.

    I hope that makes better sense. And wasn’t too long.

    #106256

    braddalton
    Participant
    Post count: 10337

    Its not official code from StudioPress and has been modified from another snippet which is 5 years old.

    Its also not code which is specific to Genesis or StudioPress.

    What i suggest you do is post the exact code you used on the WordPress Developers site and include the steps you have taken to research and try and fix the code yourself.

    This method will enable you to get the most exposure and help from WordPress Developers.

    If it where SP or Genesis code, then here is the right place but its a PHP question relating to a WordPress function.


    #106279

    Jim Colella
    Member
    Post count: 16

    Thanks Brad. Everything I’ve read on this issue is 5 (or even more) years old. I had a feeling I’d stumbled on a long-known-but-as-yet-unsolved WordPress problem. To echo comments seen elsewhere (others sites), it would seem perfectly logical to want a category-based URL to activate a category-based menu. I was just hoping someone here might have found a way within the Genesis framework. I’ll try as you’ve suggested (with fingers crossed for a solution from any passers-by here!). By the way, the site I grabbed the code from is using a Genesis theme — so with the “G” favicon appearing in the browser tab, I (oops) mistook it to be a site providing tips for Genesis. Lesson learned! I’ll certainly post back here if I ever solve this. Thanks again.

    #106314

    Jim Colella
    Member
    Post count: 16

    Solved! I found a far more recent piece of code here (dated Feb. 2014).

    For anyone struggling with the same issue, add this to your functions.php:

    function wpse_134409_current_category_class($classes, $item) {
    if (
    is_single()
    && ‘category’ === $item->object
    && in_array($item->object_id, wp_get_post_categories($GLOBALS['post']->ID))
    )
    $classes[] = ‘current-category’;

    return $classes;
    } // function wpse_134409_current_category_class

    add_filter(‘nav_menu_css_class’, ‘wpse_134409_current_category_class’, 10, 2);

    And the necessary css selector in Eleven40 Pro:

    .nav-primary .current-category a {
    //*your styling here
    }

    …which wasn’t from the site linked to above, but after some fumbling around, I found it. Hope that helps any others lost down this path.

    Category-based menu URL highlighted

    #106318

    braddalton
    Participant
    Post count: 10337

    Thanks for sharing the code and linking back to the source Jim.

    What i do is paste the code into a Github Gist and embed it so that way it doesn’t break the code when copied and i can also make changes if needed. Cheers


Viewing 7 posts - 1 through 7 (of 7 total)

The topic ‘category menu highlighting for single posts in Eleven40 Pro’ is closed to new replies.