wp_list_pages 的 Wordpress Walker 类

Question

我正在使用 wp_list_pages 在我的网站中创建页面导航。

有些页面有一个子页面，所以我需要在导航中设置一个下拉菜单来显示子页面。

我正在使用引导程序来创建下拉菜单。

要使用引导程序，我需要将类名添加到包含子页面的 li、a 和 ul

我认为添加这些类的最佳方法是使用自定义 walker 类。

如何编写这个自定义类来添加我需要的类。

输出的html

    <ul class="">
        <li class="page_item page-item-6 current_page_item"><a href="/">Home</a></li>
        <li class="page_item page-item-6 current_page_item"><a href="/">Profile</a></li>
        <li class="page_item page-item-8 page_item_has_children">
            <a href="">Products &#038; Services</a>
            <ul class='children'>
                <li class="page_item page-item-17"><a href="">Buying</a></li>
                <li class="page_item page-item-19"><a href="">Selling</a></li>
                <li class="page_item page-item-23"><a href="">Managing</a></li>
            </ul>
        </li>
    </ul>

我需要的html

    <ul class="">
        <li class="page_item page-item-6 current_page_item"><a href="/">Home</a></li>
        <li class="page_item page-item-6 current_page_item"><a href="/">Profile</a></li>
        <li class="page_item page-item-8 page_item_has_children dropdown">
            <a href="" data-toggle="dropdown" class="dropdown-toggle">Products &#038; Services</a>
            <ul class='children dropdown-menu'>
                <li class="page_item page-item-17"><a href="">Buying</a></li>
                <li class="page_item page-item-19"><a href="">Selling</a></li>
                <li class="page_item page-item-23"><a href="">Managing</a></li>
            </ul>
        </li>
    </ul>

Answer 1

使用jquery：

$(".page_item_has_children").each(function() {
  $(this).addClass("dropdown");
});

$("li.page_item_has_children > a").each(function() {
  $(this).addClass("dropdown-toggle");
  $(this).attr( "data-toggle", "dropdown" );
  $(this).next().addClass("dropdown-menu");
});

Working Example