如何将(Css)类仅添加到一个wp_NAV_Menu()?

时间:2010-11-21 作者:kaiser

编辑

我删除了原来的问题,因为这个Q现在有1000多个视图,这意味着向您展示一些可以工作的东西对很多人来说都很重要a)无需定制助行器&;b) 这很简单注意:我只删除了原始Q,因为它非常不引人注目。

该任务将css类添加到通过(管理UI)外观>菜单添加的特定导航菜单中的所有导航菜单项。

功能

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 );
这有帮助吗?别忘了投赞成票!:)

4 个回复
最合适的回答,由SO网友:t31os 整理而成

首先,我要说一些类似于Horttcore的话。。

有什么原因不能简单地为给定的菜单提供不同的容器元素,它应该提供足够的特殊性,使其具有独特的样式。

尽管如此,您可以根据菜单的位置对菜单参数进行条件化。。

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\' );
以上代码基于codex页面上给出的示例wp_nav_menu, 并且可以很容易地扩展到做任何事情
http://codex.wordpress.org/Function_Reference/wp_nav_menu

希望这有帮助。。

SO网友:Horttcore

也许我误解了你的意思,但你为什么不在你的主题中加入这个类呢?调用菜单时指定类。

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

SO网友:Timothy Brand

我有一个非常相似的问题。我需要针对一个特定的wp_nav_menu() 并将a链接替换为类。以下是我针对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 );
您可以使用它替换导航菜单中的任何部分。希望这有帮助。

SO网友:quratulain qadir

要向菜单项添加CSS类,请转到Appearance > Menu > Screen Options (屏幕右上角)并确保选中了CSS类。这将允许您向每个菜单项添加CSS类。对于多个类名,请用空格分隔每个项目,例如:

my-class-one my-class-two

结束

相关推荐

为什么每个页面都添加了adadtStyles-css样式表链接?

通过查看我网站上任何WordPress页面的来源,我可以看到以下样式表链接:<link rel=\'stylesheet\' id=\'adoptStyles-css\' href=\'http://mydomain.com/wp-content/plugins//adopt_styles.css?ver=2.9.1\' type=\'text/css\' media=\'all\' /> 链接已断开-我的WordPress未提供URL。(双斜杠不是问题的根源)以前有人见