Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

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?

<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>

share|improve this question
    
How did you add the custom post type item to the menu? –  mrwweb May 5 '12 at 22:42
    
@mrweb I've got a page called Events that I want to be highlighted when I'm on a custom post type called events. –  Rob May 10 '12 at 15:57
    
To further clarify, you want the menu item to be highlighted on 1) all "Event" post type posts, 2) a single post named "Events," or 3) The "Event" post type archive? The code you list only displays Pages anyway, not custom post types. –  mrwweb May 10 '12 at 17:53
    
@mrwweb I want it to be highlighted on ALL event post types and the event post type archive. Bear in mind the menu is also made up of just normal pages (hence the code above). –  Rob May 10 '12 at 18:05
add comment

2 Answers 2

up vote 1 down vote accepted
+50

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).

share|improve this answer
    
Awesome, been struggling with that one across several sites. Thanks very much! Also opened my eyes to the <body class> tag!! –  Rob May 10 '12 at 20:24
    
Glad to help. Check out it's awesome sister post_class() and make sure to note that you can pass additional classes to both functions as arguments. –  mrwweb May 10 '12 at 20:58
add comment

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

share|improve this answer
    
I want to highlight a page called Events when on a custom post type called events. –  Rob May 10 '12 at 16:01
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.