Создать пользовательский nav_menu для wordpress

Question

Я пытаюсь создать пользовательский nav_menu для wordpress, но я не знаю, как это сделать. Я хочу, чтобы пункт меню в этом шаблоне:

<ul class="nav nav-list"> 
<li class=""> 
    <a href="index.html"> 
     <i class="menu-icon fa fa-tachometer"></i> 
     <span class="menu-text"> Dashboard </span> 
    </a> 

    <b class="arrow"></b> 
</li> 

<li class=""> 
    <a href="#" class="dropdown-toggle"> 
     <i class="menu-icon fa fa-desktop"></i> 
     <span class="menu-text"> UI &amp; Elements </span> 

     <b class="arrow fa fa-angle-down"></b> 
    </a> 

    <b class="arrow"></b> 

    <ul class="submenu"> 
     <li class=""> 
      <a href="#" class="dropdown-toggle"> 
       <i class="menu-icon fa fa-caret-right"></i> 

       Layouts 
       <b class="arrow fa fa-angle-down"></b> 
      </a> 

      <b class="arrow"></b> 

      <ul class="submenu"> 
       <li class=""> 
        <a href="top-menu.html"> 
         <i class="menu-icon fa fa-caret-right"></i> 
         Top Menu 
        </a> 

        <b class="arrow"></b> 
       </li> 
      </ul> 
     </li> 
    </ul> 
</li> 

Я ищу в Интернете и найти библиотеку как Walker_Nav_Menu, но я не понимаю делать.

Answer 1

Да, вы можете сделать это, используя класс walker. см следующий код:

class custom_Menu_Walker extends Walker_Nav_Menu { 

    var $number = 1; 

    function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) { 
     $indent = ($depth) ? str_repeat("\t", $depth) : ''; 

     $class_names = $value = ''; 

     $classes = empty($item->classes) ? array() : (array) $item->classes; 
     $classes[] = 'menu-item-' . $item->ID; 

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

     $id = apply_filters('nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args); 
     $id = $id ? ' id="' . esc_attr($id) . '"' : ''; 

     $output .= $indent . '<li' . $id . $value . $class_names .'>'; 

     $atts = array(); 
     $atts['title'] = ! empty($item->attr_title) ? $item->attr_title : ''; 
     $atts['target'] = ! empty($item->target)  ? $item->target  : ''; 
     $atts['rel'] = ! empty($item->xfn)  ? $item->xfn  : ''; 
     $atts['href'] = ! empty($item->url)  ? $item->url  : ''; 

     $atts = apply_filters('nav_menu_link_attributes', $atts, $item, $args); 

     $attributes = ''; 
     foreach ($atts as $attr => $value) { 
      if (! empty($value)) { 
       $value = ('href' === $attr) ? esc_url($value) : esc_attr($value); 
       $attributes .= ' ' . $attr . '="' . $value . '"'; 
      } 
     } 

     $item_output = $args->before; 
     $item_output .= '<a'. $attributes .'>'; 
     $item_output .='<i class="menu-icon fa fa-tachometer"></i><span class="menu-text">'; 
     $item_output .= $args->link_before . apply_filters('the_title', $item->title, $item->ID) . $args->link_after; 
     $item_output .='</span>'; 
     $item_output .= '</a>'; 
     $item_output .= $args->after; 

     $output .= apply_filters('walker_nav_menu_start_el', $item_output, $item, $depth, $args); 
    } 

} 
wp_nav_menu(
    array(
     "container"   => "nav", 
     "container_class" => "container", 
     "container_id"  => "nav", 
     "fallback_cb"  => false, 
     "menu_class"  => "six columns omega main-nav sf-menu", 
     "theme_location" => "primary", 
     "walker"   => new custom_Menu_Walker(), 
    ) 
); 

Здесь Нанести условие, как вам требуется