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.

Edit

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() )
        return;

    # >>>> 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'] ) 
        return;

    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! :)

share|improve this question
    
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 '10 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 '10 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 '10 at 15:56

2 Answers 2

up vote 3 down vote accepted

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.
http://codex.wordpress.org/Function_Reference/wp_nav_menu

Hope that helps..

share|improve this answer
    
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 '10 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 '10 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 '10 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 '10 at 20:12
1  
Happy to help... :) –  t31os Dec 14 '10 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' ) ); ?>
share|improve this answer
    
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 '10 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 '10 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 '10 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 '10 at 8:22
    
sadly it would break everything in the layout in case js is turned off. –  kaiser Feb 9 '11 at 16:07

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.