Question

我刚开始使用WP主题而且我坚持使用Walker类。我想输出以下代码：

<ul>
<li><a href="#" title="">Menu 1</a></li>
<li><a href="#" title="">Menu 2</a></li>
<li class="hasDropdown">
    <a href="#" title="">Menu 3 - Level 1</a>
    <div>
        <div>
            <h5>Description 1</h5>
            <ul>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
            </ul>
        </div>

        <div>
            <h5>Description 2</h5>
            <ul>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
            </ul>
        </div>

        <div>
            <h5>Description 3</h5>
            <ul>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
            </ul>
        </div>

        <div>
            <h5>Description 4</h5>
            <ul>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
                <li><a href="#" title="">Menu 3 - Level 2</a></li>
            </ul>
        </div>
    </div>
</li>
<li><a href="#" title="">Menu 4</a></li>
<li><a href="#" title="">Menu 5</a></li>

我已经阅读了很多关于步行者课程的文章，但每篇文章都是我想要做的一小部分。我想把它们放在一起，以便更好地理解。我不确定如何开始/结束并设置具有下拉级别的菜单。请任何人可以帮忙吗？非常感谢提前。

我尝试过复制和修改nav-menu-template中的walker类，如下所示：

function start_lvl( &$output, $depth = 0, $args = array() ) {
    $indent = str_repeat("\t", $depth);
    $output .= "\n$indent<div>\n";
    $output .= "\n$indent<h5></h5>\n";
    $output .= "\n$indent<ul class=\"sub-menu\">\n";
}


function end_lvl( &$output, $depth = 0, $args = array() ) {
    $indent = str_repeat("\t", $depth);
    $output .= "$indent</ul>\n";
    $output .= "\n$indent</div>\n";
}

这给了我：

<div><h5><ul>

我正在努力了解如何实现包装div和.hasDropdown

Answer 1

尝试覆盖另一种方法。（它在Walker类中实现，Walker_Nav_Menu扩展。）

function display_element( $element, &$children_elements, $max_depth, $depth=0, $args, &$output ) {
    $id_field = $this->db_fields['id'];

     if (! empty( $children_elements[$element->$id_field] )) {
         $element->classes[] = "hasDropdown";
     }

     parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );
}

对于div元素包装，你必须深入挖掘display_element方法（位于wp-includes/class-wp-walker.php），但我相信你会知道该怎么做。

Wordpress自定义菜单沃克

1 个答案: