How do I add the active class to the current link that the user is viewing? I have a mixture of pages and custom post types in my main nav menu and I know that wordpress has .current_page_item that can be used but when I tried that nothing happened. I'm slightly confused about how to implement it. Currently the menus for the site are being pulled in using:

<?php wp_nav_menu( array( 'theme_location' => 'header-menu' ) ); ?>


<?php wp_nav_menu( array('menu' => 'Mobile Menu' )); ?> - for mobile state.


1 Answer 1



Two things:

  1. wp_nav_menu() also outputs .current_page_item, as backward compatibility with wp_page_menu().
  2. Among the list item CSS classes added by wp_nav_menu(), for a custom post type, list items will have a CSS class .list-type-object-{slug}, where {slug} is the CPT slug. So, you could target: .list-type-object-{slug}.current-list-item

Original Answer

The key is in the class name: .current_page_item. That class is added by wp_page_menu(), whereas wp_nav_menu() adds .current-list-item.

What that means is that wp_nav_menu() is outputting its fallback menu, and not a user-created custom nav menu.


  1. Custom nav menu Theme Location is registered via register_nav_menu() or register_nav_menus()
  2. Call to wp_nav_menu() includes the theme_location parameter *and not the menu parameter, and that thetheme_locationpassed towp_nav_menu()matches the one defined inregister_nav_menu()/register_nav_menus()`
  3. At least one custom nav menu is defined via Appearance -> Menus
  4. A defined custom nav menu is assigned to the Theme Location that corresponds to theme_location passed to wp_nav_menu().

For example:

  1. Register

    function wpse117502_theme_setup() {
        register_nav_menus( array(
            'primary' => 'Primary'
        ) );
    add_action( 'after_setup_theme', 'wpse117502_theme_setup' );
  2. Call

    wp_nav_menu( array(
        'theme_location' => 'primary'
    ) );
  3. Define

    User creates a menu, e.g. "Main Menu"

  4. Assign

    User assigns "Main Menu" to "Primary" Theme Location

  • Thanks @chip Ive realised that for the page items in my navigation the class being applied by wordpress is: li.current-menu-item and so I can style those ones as I please, however for the custom post types I cant figure out which class wordpress is assigning which is making it difficult to style them. Oct 11, 2013 at 13:36
  • Did you check the linked Codex references for wp_nav_menu() list item classes? (See edited answer.) Oct 11, 2013 at 13:45
  • I have read through the codex but everything I try for the custom post types isnt working. The custom post types are in the main nav and then they are sub-nav items. I have viewed the source code and found that wordpress is assigning the following class to the current post type page: menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-133 current_page_item menu-item-137 Oct 11, 2013 at 13:50
  • Nope; you're on a static page: menu-item-object-page. Can you post a live link? Oct 11, 2013 at 13:54
  • purpleclaw.org.uk/lulu - Link to the site Oct 11, 2013 at 13:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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