扩展Walker导航,将数据属性添加到标记

时间:2014-06-19 作者:dborghez

我将为a 菜单中的标签,如have<a href="#example" data-attribute="attribute">CLICK</a>

我知道我必须扩展Walker,但我尝试了好几次(在internet上找到一些代码),但都没有成功。

这里是代码(我还没有尝试插入data-attribute 因为在我开始制作菜单之前。)代码:

/* WALKER */
wp_nav_menu( array(
 \'container\' =>false,
 \'menu_class\' => \'nav\',
 \'echo\' => true,
 \'before\' => \'\',
 \'after\' => \'\',
 \'link_before\' => \'\',
 \'link_after\' => \'\',
 \'depth\' => 0,
 \'walker\' => new description_walker())
 );
 class description_walker extends Walker_Nav_Menu
{
      function start_el(&$output, $item, $depth, $args)
      {
           global $wp_query;
           $indent = ( $depth ) ? str_repeat( "\\t", $depth ) : \'\';

           $class_names = $value = \'\';

           $classes = empty( $item->classes ) ? array() : (array) $item->classes;

           $class_names = join( \' \', apply_filters( \'nav_menu_css_class\', array_filter( $classes ), $item ) );
           $class_names = \' class="\'. esc_attr( $class_names ) . \'"\';

           $output .= $indent . \'<li id="menu-item-\'. $item->ID . \'"\' . $value . $class_names .\'>\';

           $attributes  = ! empty( $item->attr_title ) ? \' title="\'  . esc_attr( $item->attr_title ) .\'"\' : \'\';
           $attributes .= ! empty( $item->target )     ? \' target="\' . esc_attr( $item->target     ) .\'"\' : \'\';
           $attributes .= ! empty( $item->xfn )        ? \' rel="\'    . esc_attr( $item->xfn        ) .\'"\' : \'\';
           $attributes .= ! empty( $item->url )        ? \' href="\'   . esc_attr( $item->url        ) .\'"\' : \'\';

           $prepend = \'<strong>\';
           $append = \'</strong>\';
           $description  = ! empty( $item->description ) ? \'<span>\'.esc_attr( $item->description ).\'</span>\' : \'\';

           if($depth != 0)
           {
                     $description = $append = $prepend = "";
           }

            $item_output = $args->before;
            $item_output .= \'<a\'. $attributes .\'>\';
            $item_output .= $args->link_before .$prepend.apply_filters( \'the_title\', $item->title, $item->ID ).$append;
            $item_output .= $description.$args->link_after;
            $item_output .= \'</a>\';
            $item_output .= $args->after;

            $output .= apply_filters( \'walker_nav_menu_start_el\', $item_output, $item, $depth, $args );
            }
}
这里是错误:enter image description here

有什么可以帮我的吗?谢谢:)

1 个回复
SO网友:Hooman Askari

这就是我如何将数据属性添加到菜单的方法,只需将数据标题=“菜单标题”添加到主导航上的每个链接,更改它以适应您的需要。

您实际上不需要使用导航步行器来添加此

add_filter( \'nav_menu_link_attributes\', \'cfw_add_data_atts_to_nav\', 10, 4 );
    function cfw_add_data_atts_to_nav( $atts, $item, $args ) {

    $atts[\'data-title\'] = $item->post_title;
    return $atts;
}

结束

相关推荐

在Walker函数中使用Menu类

是否使用选项中打开的自定义菜单css类,通过walker函数将这些类应用于span 而不是li\'s?我的定制助行器:class ik_walker extends Walker_Nav_Menu { function start_lvl(&$output, $depth) { $GLOBALS[\'ik_walker_counter\'] = 0; $output .= \'<nav class=\"site-nav