Highlight menu item when on a custom post type?

2 Views

I’m currently using this code to display a menu of pages. I’m using CSS to target the class current_page_item which works fine until you’re on a page with a custom post type.

How can I target that class when the page the user is on is a custom post-type such as news or events?

Read More
<div id="menu-repeat">
<?php $args = array(
'depth'        => 1,
'show_date'    => '',
'date_format'  => get_option('date_format'),
'child_of'     => 0,
'exclude'      => '1908, 6282, 6380',
'include'      => '',
'title_li'     => __(''),
'echo'         => 1,
'authors'      => '',
'sort_column'  => 'menu_order, post_title',
'link_before'  => '',
'link_after'   => '',
'walker' => '' ); ?>
<ul><div class="menu-button"><?php wp_list_pages( $args, 'sort_column=menu_order' ); ?></div></ul>
Post Views: 2

Related posts

Leave a Reply

2 comments

  1. If this is for a one-off site, I would suggest doing this with CSS. Philosophically, adding the current_page_item class to a menu item when that’s not true feels a bit wrong too.

    As long as you’re using the body_class() function on your <body> element in the theme, there should be a class called single-{event} where “{event}” is the id of the post type. Hence, add the selector .single-{event} .page-item-{ID} where “{ID}” is the page ID of the events page (you’ll see that as the class on the menu item as well).

  2. I believe this has been reported as a bug. The only solutions I’ve seen is on the trac ticket #17590

    function my_page_css_class( $css_class, $page ) {
    global $post;
    if ( $post->ID == $page->ID ) {
        $css_class[] = 'current_page_item';
    }
    return $css_class;
}
add_filter( 'page_css_class', 'my_page_css_class', 10, 2 );

    The alternative would be using some javascript magic to insert a class using addClass