在wp导航菜单中将父页面和子页面包装在单独的ul中

Question

我需要如下所示的导航菜单结构。

<ul class="side-menu-list">
    <li><a href="#">Parent Page 1</a>
        <ul>
            <li><a href="#">Traditional Braces</a></li>
            <li><a href="#">Lingual Braces</a></li>
            <li><a href="#">Invisalign</a></li>
            <li><a href="#">Temporary Anchorage Devices</a></li>
            <li><a href="#">Surgical Orthodontics</a></li>
            <li><a href="#">TMJ Treatment</a></li>
            <li><a href="#">All About Retainers</a></li>
            <li><a href="#">Emergency Treatment</a></li>
        </ul>
    </li>
</ul>
<ul class="side-menu-list">
    <li><a href="#">Paent Page 2</a>
        <ul>
            <li><a href="#">Early Treatment/Prevention</a></li>
            <li><a href="#">Two-Phase Treatment</a></li>
            <li><a href="#">Hometown Smiles Gallery</a></li>
        </ul>
    </li>
</ul>

这意味着每个父页面及其子页面都应包含在ul中。因此，我寻找一个自定义的walker菜单，以便每个主菜单及其子菜单将动态包装在ul标签中。

Answer 1

 // Register two menus
 // Go to Menus and add menu items to each menu
 // call the wp_nav_menu function twice.
 // this goes in functions.php
 register_nav_menus( array(
   'primary'  => __( 'Primary', 'text-domain' ),
   'secondary'  => __( 'Secondary', 'text-domain' )
                    ) );

 <ul class="side-menu-list">
   <li><a href="#">Parent Page 1</a>
    // display the menu on front end
    wp_nav_menu(
       array(
        'theme_location'    => 'primary',
        'depth'             => 2,
        'container'         => 'div',
        'container_id'      => 'primary',
        'container_class'   => 'primary',
        'menu_class'        => 'ul-class' ) );
   </li>
  </ul>

 <ul class="side-menu-list">
   <li><a href="#">Parent Page 1</a>
    wp_nav_menu(
       array(
        'theme_location'    => 'secondary',
        'depth'             => 2,
        'container'         => 'div',
        'container_id'      => 'secondary',
        'container_class'   => 'secondary',
        'menu_class'        => 'ul-class' ) );
   </li>
  </ul>