添加一个 div 并使用 wordpress walker 更改类或导航菜单？

Posted 2023-03-06

【中文标题】添加一个 div 并使用 wordpress walker 更改类或导航菜单？

【英文标题】：Add a div and change the classes or navigation menu using wordpress walker?

【发布时间】：2013-11-25 20:16:57

【问题描述】：

我想知道如何制作一个 WordPress wp_nav_menu() 或 wp_list_pages() Walker 类来生成这样的导航菜单输出？

<!-- Level1 -->
    <li class="current">
            <a href="#">Name</a>
<!--Level2-->
            <div class="nav-sub">
                    <ul>
                            <li><a href="#">Name</a></li>
                            <li>
                                    <a href="#">Name</a>
<!--Level3-->
                                    <div class="nav-sub">
                                            <ul>
                                                    <li>
                                                            <a href="#">Name</a>
<!--Can Add Unlimited levels If Possible-->
                                                    </li>
                                                    <li><a href="#">Name</a>
                                            </li>
                                            </ul>
                                    </div>
                            </li>
                            <li><a href="#">Name</a></li>
                            <li><a href="#">Name</a></li>
                    </ul>
            </div>
    </li>

    <!-- This is One Level only -->
    <li>
            <a href="#">Name</a>
    </li>

我尝试了很多方法，但无法弄清楚。 这是使用 wp_list_pages() 的当前输出

<ul class="myclass">
<li id="home"><a href="/index.php">Home</a></li>
<li class="page_item page-item-2 page_item_has_children"><a href="http://localhost/wordpress/sample-page/">Sample Page</a>
<ul class="children">
<li class="page_item page-item-9"><a href="http://localhost/wordpress/sample-page/home/">Home</a></li>
</ul>
</li>
<li class="page_item page-item-19"><a href="http://localhost/wordpress/page-no-sub/">page no sub</a></li>
</ul>

提前致谢！

P.S：我已经在http://codex.wordpress.org/Function_Reference/wp_nav_menu这里读过这篇文章，但不知道:(

【参考方案1】：

编辑：

好吧，看看不同的参数并调用你的菜单

<?php
class Child_Wrap extends Walker_Nav_Menu

    function start_lvl(&$output, $depth)
    
        $indent = str_repeat("\t", $depth);
        $output .= "\n$indent<div class=\"div-sub\"><ul class=\"sub-menu\">\n";
    
    function end_lvl(&$output, $depth)
    
        $indent = str_repeat("\t", $depth);
        $output .= "$indent</ul></div>\n";
    


wp_nav_menu( 


    array( 
        'menu' => 'navigation',//(i created this menu on the backend of wordpress)
        'container'       => 'div',
        'container_class' => 'menu-sidebar', 
        'menu_class'      => 'menu-class',
        'menu_id'         => 'menu-id',
        'theme_location' => 'primary', 
        'walker' => new Child_Wrap() 

    ) 



 ); ?>

您可以指定许多参数（id 菜单、类和 id 容器等...）

source class walker

Should you find your happiness here

Name menu screen ('menu' => 'navigation')

【讨论】：

我明白了，但是你知道如何在第一个代码字段中可以看到的子级别 之前添加 吗？

你需要完整的 2 个参数（$container & $container_class）。我在我的例子中指定了。我将在 5 分钟内完成我的示例。

这是我现在使用您的代码得到的结果：pastebin.com/6whPQQP9 另外请检查我的 PHP 代码是否正确：pastebin.com/ryJTAvLm

我添加了 Walker_nav_menu 类并更正了我的代码（忘记一个“，”），我明白你现在在做什么^^'

现在是代码，看起来更糟pastebin.com/NzQanhQV，我的WP版本有问题吗？现在是 3.7.1