大型菜單WordPress步行者

Question

這是我的菜單結構，我如何構建一個超級菜單步行者，我如何做到這一點？

<nav> 
    <ul class="main-nav navbar-right"> 
     <li class="active dropdown"><a href="#">Home</a> 
      <div class="sub-menu"> 
       <ul class="home"> 
        <li><a href="index.html">Home</a></li> 
        <li><a class="last" href="index-2.html">Home2</a></li> 
       </ul> 
      </div> 
     </li> 
     <li class="dropdown"><a href="#">Pages</a> 
      <div class="mega-menu pages"> 
       <span class="mega-menu-list"> 
        <a href="">Blog1</a> 
        <a href="">Blog2</a> 
        <a href="">Blog3</a> 
       </span> 
       <span class="mega-menu-list"> 
        <a href="">Single Blog 1</a> 
        <a href="">Single Blog 2</a> 
        <a href="">Single Blog 3</a> 
        <a href="">Single Blog 4</a> 
       </span> 
       <span class="mega-menu-list"> 
        <a href="">404 Page</a> 
        <a href="">Contact Us</a> 
       </span> 
      </div> 
     </li> 
     <li class="dropdown"><a href="#">Sport</a></li> 
     <li><a href="#">Travel</a></li> 
     <li><a href="#">Lifestyle</a></li> 
     <li><a href="#">Tech</a></li> 
     <li><a href=">Contact Us</a></li> 
    </ul> 
</nav> 

Answer 1

你可以把你的菜單結構HTML放在這段代碼中。

/* Drop Down Menu */ 
class ik_walker extends Walker_Nav_Menu{ 
function start_lvl(&$output, $depth) { 
    if($depth == 0){ 
     $output .= 'HTML Start Here for Parent Menu 
        '; 
    } 
    if($depth == 1){ 
     $output .= '<ul class="sub-child"> Start Here for child Menu'; 
    } 
} 
function end_lvl(&$output, $depth) { 
    if($depth == 0){ 
     $output .= 'End For Parent Menu 

        '; 
    } 
    if($depth == 1){ 
     $output .= '</ul> End for child'; 
    } 
} 
} 

並在菜單中使用此功能就像這樣。

if (has_nav_menu('primary')) : 
        wp_nav_menu(array(
         'theme_location' => 'primary', 
         'menu_class'  => 'horizontal_links navigations', 
         'container' => '', 
         'depth'   => 3, 
         'walker' => new ik_walker() 
        )); 
       endif;