Comment ajouter des classes (CSS) à un seul wp_nav_menu ()?

Question

Modifier

Je retiré la question initiale que ce Q a bien au-dessus de 1.000 vues maintenant - ce qui signifie qu'il est important pour beaucoup de gens - vous montrer quelque chose qui fonctionne a) sans mesure Walker & b) est facile. Note:. Je n'enlevé à Q d'origine, car il était assez peu spectaculaire

Le Groupe

Ajouter des classes CSS pour tous les éléments du menu de navigation à l'intérieur d'un menu spécifique Nav qui a été ajouté par (UI admin) Apparence> Menu.

La fonction

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

était-il utile? Ne pas oublier de voter up! :)

Answer 1

Je vais commencer par dire quelque chose de similaire à Horttcore ..

Y at-il une raison que vous ne pouvez pas simplement fournir un élément de conteneur différent pour le menu donné, il doit fournir suffisamment de spécificité pour le dénommer unique.

Bien, vous pourriez faire quelque chose comme ça au menu conditionalise args basé sur l'emplacement du menu ..

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' );

code ci-dessus est basé sur l'exemple donné sur la page codex pour wp_nav_menu, et pourrait facilement être étendu à faire un certain nombre de choses.
http://codex.wordpress.org/Function_Reference/wp_nav_menu

Hope qui aide ..

Answer 2

Peut-être que je vous ai eu tort, mais pourquoi ne vous pas ajouter la classe dans votre thème? Spécifiez la classe lorsque vous appelez le menu.

<?php wp_nav_menu( array( 'theme_location' => 'Top Nav', 'menu_class' => 'span-3' ) ); ?>

Answer 3

J'ai eu un problème très similaire. Je avais besoin de cibler un wp_nav_menu() spécifique et remplacer les liens avec une classe. Voici ma solution en référence à l'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 );

Vous pouvez l'utiliser pour remplacer toute pièce dans vos menus de nav. J'espère que cela t'aides.

Answer 4

Pour ajouter une classe CSS à un élément de menu, allez à Apparence> Menu> Options de l'écran (en haut à droite de l'écran) et assurez-vous que Classes CSS est cochée. Cela vous permettra d'ajouter des classes CSS à chaque élément de menu. Pour plusieurs noms de classe, séparer chaque élément par un espace, par exemple:.

my-class-one my-class-two