I removed the original Question as this Q has far above 1.000 views now - which means it's important to a lot of people - to show you something that works a) without a custom Walker & b) is easy. Note: I only removed to original Q, because it was pretty unspectacular.

The Task

Add css classes to all nav menu items inside a specific Nav Menu that was added via (admin UI) Appearance > Menu.

The function

function wpse4388_navmenu_classes( $items, $menu, $args )
    // prevent crashing the appearance > menu admin UI
    if ( is_admin() )

    # >>>> start editing

        // Nav menu name you entered in the admin-UI > Appearance > Menus (Add menu).
        $target['name'] = 'Topnav';

        // A targeted menu item that needs a special class - add the item number here
        $target['items'] = array( (int) 6 );

    # <<<< stop editing

    // filter for child themes: "filter_nav_menu_{nav menu name}"
    // the nav menu name looses all empty spaces and is set to lower
    // if you want to use the filter, hook your child theme function into 'after_setup_theme'
    $target = apply_filters( 'filter_nav_menu_'.strtolower( str_replace( " ", "", $target['name'] ), $target );

    // Abort if we're not with the named menu
    if ( $menu->name !== $target['name'] ) 

    foreach ( $items as $item )
        // Add the class for each menu item
        $item->classes = 'classes for all items';

        // Append this class if we are in one of the targeted items
        if ( in_array( (int) $item->menu_order, $target['items'] ) )
            $item->classes .= ' only for a single item';

    return $items;
add_filter( 'wp_get_nav_menu_items', 'wpse4388_navmenu_classes', 10, 3 );

Was it helpful? Don't forget to vote up! :)

  • What is a menu location as you name it in your question? Logically some location in a menu, but how do you specify it? And you write "different menu locations" - is this is a list of these not further specified locations or is this let's say by parent?
    – hakre
    Nov 21, 2010 at 21:31
  • What i want to do is to add for ex. the class of "span-3" only to the "Top Nav" menu location. That's why i tried to use "is_nav_menu( 'Mainnav' )". Problem is, that this only returns boolean for location names entered at the admin UI and then, fun as it is, returns true for all location. So the class get's added to all locations.
    – kaiser
    Nov 23, 2010 at 15:28
  • @t31os. Thanks, but i want to add classes to the menu items, not to the "container" or the <ul>. (Sorry, for adding my comment here, but there was no "add comment" link below).
    – kaiser
    Nov 23, 2010 at 15:56

4 Answers 4


I'm going to start by saying something similar to Horttcore..

Is there a reason you can't simply provide a differing container element for the given menu, it should provide enough specificity to style it uniquely.

Although, you could do something like this to conditionalise menu args based on the menu's location..

function my_wp_nav_menu_args( $args = '' ) {
    if( $args['theme_location'] == 'your-specific-location' )
        $args = array_merge( array(
            'container_class' => 'example',
            'menu_class' => 'example2'
        ), $args );
    return $args;
add_filter( 'wp_nav_menu_args', 'my_wp_nav_menu_args' );

Above code is based on the example given on the codex page for wp_nav_menu, and could easily be extended to do any number of things.

Hope that helps..

  • Thanks, but i want to add classes to the menu items, not to the "container" or the <ul>. (Sorry, for adding my comment here, but there was no "add comment" link below).
    – kaiser
    Nov 30, 2010 at 12:44
  • Why does this menu need specific classes on list items though? Providing the menu with a unique ID or class will provide enough specificity to manipulate that particular menu(be it styling or script). What is the end goal here?
    – t31os
    Nov 30, 2010 at 14:15
  • @t31os: I use a css grid framework and don't want to add the classes in the Admin-UI (no import/export from local to server possible). If i would recode my classes in each project, i would go your way, but this is something i don't do. And due to the fact that the framework is a public open source project and i'm one of the core devs, i don't want to fork it just to meet the wordpress css classes.
    – kaiser
    Dec 7, 2010 at 23:32
  • 1
    @t31os: fun as live is: i just solved the same problem for someone else, who just wanted to get rid of the classes and the id (using the filter) and didn't realise that i have the same problem. omg. thanks a lot to you t31os and everybody else writing here!
    – kaiser
    Dec 12, 2010 at 20:12
  • 1
    Happy to help... :)
    – t31os
    Dec 14, 2010 at 20:53

Maybe I got you wrong, but why don't you add the class in your theme? Specify the class when you call the menu.

<?php wp_nav_menu( array( 'theme_location' => 'Top Nav', 'menu_class' => 'span-3' ) ); ?>
  • Thanks for your answer, but menu_class adds a class to the <ul>. What i need is the possibility to add classes to the <li> items.
    – kaiser
    Nov 23, 2010 at 15:24
  • Why? You can simply combine the class selector i.e. .myClass .current_page_item {[…]} Maybe it would help to know what you are trying to do.
    – Horttcore
    Dec 1, 2010 at 12:33
  • I use a css grid framework and want to add classes to the li-Elements. Due to the different width of the elements i need to add for ex. span-2 to the first element, span-4 to the second, etc. Currently i can only add those classes at the Admin-UI, which is a pain, because i can't export/import it (or export the whole options table, which i don't need) from local to server.
    – kaiser
    Dec 7, 2010 at 23:30
  • 1
    Perhaps there is a filter for that, but maybe you might wanna use Javascript to add those classes?
    – Horttcore
    Dec 8, 2010 at 8:22
  • sadly it would break everything in the layout in case js is turned off.
    – kaiser
    Feb 9, 2011 at 16:07

I had a very similar issue. I needed to target a specific wp_nav_menu() and replace the a links with a class. Here is my solution in reference to the OP:

function theme_add_menuclass( $classes, $args ) {
    if ( $args->theme_location == 'your-menu-location' ) {
        return preg_replace( '/<li /i', '<li class="your-class"', $classes );
    return $classes;
add_filter( 'wp_nav_menu_items', 'theme_add_menuclass', 10, 2 );

You can use this to replace any piece in your nav menus. Hope this helps.

  • Hi Timothy. Welcome and thanks for sharing. I edited your answer and added a semicolon to not break the site when someone is using your code. Sidenote: You may want to use the i modifier for your Regex to remove case sensitivity as <LI is a fully valid HTML tag syntax :)
    – kaiser
    Mar 24, 2015 at 1:58
  • Thank you. I had a hard time putting the code in, first time and all. :) Mar 25, 2015 at 4:21

To add a CSS class to a menu item, go to Appearance > Menu > Screen Options (top right of screen) and ensure that CSS Classes is checked. This will allow you to add CSS classes to each menu item. For multiple class names, separate each item by a space, e.g.:

my-class-one my-class-two

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.