我可以在锚标记之后添加分隔符<li>在Wordpress wp_nav_menu()?</li>中

时间:2011-04-19 14:26:27

标签: wordpress

我需要在锚标记之后添加<li>分隔符,如下所示:

   <li id="menu-item-27" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-27"><a href="services">Services</a></li>
<li class="separator>//</li>
<li id="menu-item-28" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-27"><a href="gallery">Gallery</a></li>  
<li class="separator>//</li>

2 个答案:

答案 0 :(得分:5)

这是一个古老的问题,但我偶然发现了同样的问题并使用自定义Walker解决了这个问题。

首先,助手在顶层的每个<li>后添加一个分隔符:

class Main_Menu_Walker extends Walker_Nav_Menu{

    function end_el( &$output, $item, $depth = 0, $args = array() ) {
        $output .= "</li>\n";

        if ($depth == 0)
            $output .="<li class='separator'>|</li>\n";        
    }
}

然后您可以使用li:last-child并隐藏最后一个分隔符或使用过滤器,如果您需要ie7支持,请将其删除。这是我的过滤器:

function menu_remove_last_separator($items){

    $separator = "<li class='separator'>|</li>";
    $pos = strrpos($items, $separator);

    if ($pos) 
        $items = substr_replace($items, '', $pos, strlen($separator));

    return $items;
}

add_filter( 'wp_nav_menu_items','menu_remove_last_separator');

现在你必须使用你的walker作为wp_nav_menu的参数:

wp_nav_menu(array(
        'theme_location' => 'navigation',
        'container'      => false,
        'menu_class'     => 'inline',
        'walker'         => new main_menu_walker()
        )
);

答案 1 :(得分:4)

是的,有两种不同的方式。 Check the codex,但以下$ arg会有所帮助。

  
    

$之前         (字符串)(可选)在链接之前输出文本

  
    Default: None 
     

$后       (字符串)(可选)在链接

之后输出文本
    Default: None 
     

$ link_before       (字符串)(可选)在链接文本

之前输出文本
    Default: None 
     

$ link_after       (字符串)(可选)在链接文本

之后输出文本
    Default: None

尝试

$args = array('after'=>'<li>//</li>');
wp_nav_menu($args);