Question

我想在wordpress导航菜单中的每个子菜单ul元素之前添加一个按钮元素，以便在移动视图中的子菜单之间切换。我的意思是：

<ul class="menu">
    <li><a href="#">Category</a></li>
    <li><a href="#">Category</a></li>
    <li><a href="#">Category</a>
        <button type="button" class="toggle-btn">
            <span class="bar"></span>
            <span class="bar"></span>
            <span class="bar"></span>
        </button>
        <ul class="submenu">
            <li><a href="#">SubCategory</a></li>
            <li><a href="#">SubCategory</a></li>                     
            <li><a href="#">SubCategory</a></li>
        </ul>
    </li>                 
</ul>

我尝试使用walker类但没有成功。我怎么能这样做？

Answer 1

在子菜单

之前添加按钮

在wp_nav_menu中添加walker类“new Add_button_of_Sublevel_Walker”

<?php
            $header_menu_defaults = array(
                'theme_location'  => '',
                'menu'            => 'your menu name',
                'container'       => '',
                'container_class' => '',
                'container_id'    => '',
                'menu_class'      => '',
                'menu_id'         => '',
                'echo'            => true,
                'fallback_cb'     => 'wp_page_menu',
                'before'          => '',
                'after'           => '',
                'link_before'     => '',
                'link_after'      => '',
                'items_wrap'      => '<ul id="%1$s" class="%2$s">%3$s</ul>',
                'depth'           => 0,
                'walker'         => new Add_button_of_Sublevel_Walker
            );
            wp_nav_menu( $header_menu_defaults );
        ?>

在function.php中添加以下函数

/* Options Frame Work End Here */

class Add_button_of_Sublevel_Walker extends Walker_Nav_Menu
{
    function start_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);
        $output .= "\n$indent<button type='button' class='toggle-btn'>
            <span class='bar'></span>
            <span class='bar'></span>
            <span class='bar'></span>
        </button><ul class='submenu'>\n";
    }
    function end_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);
        $output .= "$indent</ul>\n";
    }
}

Wordpress Nav菜单 - 如何在每个子菜单之前添加一个按钮元素？

1 个答案: