Adding Classes to the Current Page Item in wp_nav_menu()

I encountered this issue many many times while doing HTML Template to WordPress theme conversions. The thing is that WordPress will add “current-page-item” class to the current page list item in the menu, but in 90% of cases it won’t be like that in the HTML Template you’re about to convert to a WordPress theme (it’s mostly “current” or “active”). So, then you need to change classes in the CSS and maybe JS if you have something targeting the current page in the menu but that’s a bit too much work.

So i finally decided to take a look at the code behind wp_nav_menu() and write up a simple code to make my work go a bit faster and easier from now on. So here it is:

add_filter( 'nav_menu_css_class', 'additional_active_item_classes', 10, 2 );

function additional_active_item_classes($classes = array(), $menu_item = false){

	if(in_array('current-menu-item', $menu_item->classes)){
		$classes[] = 'active';
	}

	return $classes;
}

Update:

After messing around with the $menu_item array i noticed that the whole snippet can be drastically simplified. Since the $menu_item array also holds the classes the menu item will have and “current-menu-item” class is not something that’s gonna differ from theme to theme since it’s defined by the core, doing a simple in_array() check for “current-menu-item” in the classes array will do the trick. Can’t get simpler then this.