Highlight menu item when on a custom post type?

IT Nursery

May 7, 2022

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>

2 Answers
2

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

Tags: custom-post-types custom-taxonomy

2 Answers 2

Leave a Reply Cancel reply

2 Answers
2