Highlight current category, when using get_categories

I’m successfully using helgatheviking’s answer from this post: Show children of top level category only See code below:

// get the category object for the current category
$thisCat = get_category( get_query_var( 'cat' ) ); 

// if not top-level, track it up the chain to find its ancestor
while ( intval($thisCat->parent) > 0 ) {
    $thisCat = get_category ( $thisCat->parent );
}

//by now $thisCat will be the top-level category, proceed as before
$args=array(
    'child_of' => $thisCat->term_id,
    'hide_empty' => 0,
    'orderby' => 'name',
    'order' => 'ASC'
);
$categories=get_categories( $args );
foreach( $categories as $category ) { 
    echo '<a href="' . get_category_link( $category->term_id ) . '" title="'     . sprintf( __( "View all posts in %s" ), $category->name ) . '" ' . '>' .     $category->name.'</a>';  } 
?>

However, in this list of sub categories, I need to highlight the current category. I’m sure there is an easy answer, but I can’t figure it out myself.

Solutions Collecting From Web of "Highlight current category, when using get_categories"

I have solved my problem. I added this definition before my old code:

<?php
// get the category object for the current category
$thisTrueCat = get_category( get_query_var( 'cat' ) ); 
print $thisTrueCat->term_id;
?>

The above $thisTrueCat, different from $thisCat in the already existing code, retrieves the ID of the current category regardless of it’s parent. $thisCat on the other hand is set up to default back to the ID of the current category’s parent.

With $thisTrueCat established, I then added the below code inside the loop:

<li <?php if ($thisTrueCat->term_id == $category->term_id) { ?> class="xshown" <?php } ?>

This will give the list item the class xshown if the current category displayed match the category of the list item. In other words, with CSS, I highlight the category currently displayed.

Here’s my new code in it’s entirety:

    <!-- call ID of thisTrueCat -->
<?php
// get the category object for the current category
$thisTrueCat = get_category( get_query_var( 'cat' ) ); 
print $thisTrueCat->term_id; ?>

<ul class="submenu">
<!-- call submenu -->
<?php
    // get the category object for the current category
    $thisCat = get_category( get_query_var( 'cat' ) ); 

    // if not top-level, track it up the chain to find its ancestor
    while ( intval($thisCat->parent) > 0 ) {
        $thisCat = get_category ( $thisCat->parent );
    }

    //by now $thisCat will be the top-level category, proceed as before
    $args=array(
        'child_of' => $thisCat->term_id,
        'hide_empty' => 0,
        'orderby' => 'name',
        'order' => 'ASC'
    );

    $categories=get_categories( $args );
    foreach( $categories as $category ) { ?>
        <li <?php if ($thisTrueCat->term_id == $category->term_id) { ?> class="xshown" <?php } ?>><a href="<?php echo get_category_link( $category->term_id ) ?>" ><?php echo $category->name ?></a></li>  
    <?php
    }; 
?>
</ul>   

Particularly since you’re putting the categories into an unordered list, it seems worth mentioning that wp_list_categories() gives a class to the current category by default on archive pages, comes with a $current_category argument for special use cases, and is really just a complicated wrapper function of get_categories().

I don’t know the exact context of your code, but it’s quite possible you can replace it with the following:

<?php
// get the category object for the current category
$thisCat = get_category( get_query_var( 'cat' ) ); 

// if not top-level, track it up the chain to find its ancestor
while ( intval($thisCat->parent) > 0 ) {
    $thisCat = get_category( $thisCat->parent );
}
$args = array(
    'child_of' => $thisCat->term_id,
    'hide_empty' => 0,
    'orderby' => 'name',
    'order' => 'ASC',
    'use_desc_for_title' => 0
); ?>
<ul class="submenu">
    <?php echo wp_list_categories( $args ); ?>
</ul>

That would give you the CSS class current-cat on the <li> and also current-cat-parent should that ever apply (though in your case I don’t think it would ever come up).


As an accessibility aside the title attribute is mostly useless so it’s good just to turn that off (as in the code above) and not include it in theme code. WordPress core is slowly moving toward doing that itself.