1

为了制作以下输出,我使用了 wordpress 自定义 walker

class Walker_Page_Custom extends Walker_Nav_Menu {

function start_lvl(&$output, $depth) {
    $indent = str_repeat("\t", $depth);
    $output .= "\n$indent
        <div class='nav-dropdown' style='display: block; height: 1.2534674133206636px; overflow: hidden;'>
         <div class='drop-col'>
          <img id='prod' src='#' rel='#' alt='Womenswear'>
         <ul class='level0'>
         <li id='menu-item'>

    \n";
}

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

}

这是我当前的输出

<li id="menu-item-310" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-310">
    <a href="http://localhost/wp/products-page/" class="sf-with-ul">Products Page</a>
    <div class="nav-dropdown"> <!-- first one -->
        <div class="drop-col"> <!-- first one -->
            <img id="prod" src="" rel="" alt="Womenswear">
            <ul class="level0">
                <li id="menu-item-311" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-311"><a href="http://localhost/wp/products-page/your-account/">Your Account</a></li>
                <li id="menu-item-312" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-312"><a href="http://localhost/wp/products-page/transaction-results/">Transaction Results</a></li>
                <li id="menu-item-313" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-313"><a href="http://localhost/wp/products-page/checkout/" class="sf-with-ul">Checkout<span class="sf-sub-indicator"> »</span></a>
                    <div class="nav-dropdown"><!-- second one -->
                        <div class="drop-col"><!-- second one -->
                            <img id="prod" src="#" rel="#" alt="Womenswear">
                            <ul class="level0">
                                <li id="menu-item-314" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-314"><a href="http://localhost/wp/products-page/checkout/order-received/">Order Received</a></li>
                                <li id="menu-item-315" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-315"><a href="http://localhost/wp/products-page/checkout/pay/">Checkout ? Pay</a></li>
                            </ul>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</li>

如果你注意到,第一个<div class="nav-dropdown"><div class="drop-col">里面有<div class="nav-dropdown">and<div class="drop-col">

所以我需要改变第二个班级,<div class="nav-dropdown">我们<div class="drop-col">可以说<div class="inner-nav-down"><div class="inner-drop-cll">或任何其他班级,我不在乎

有什么建议编辑这个自定义助行器来完成这项工作吗?

4

1 回答 1

3
function start_lvl(&$output, $depth) {
    $indent = str_repeat("\t", $depth);
    $inner = $depth ? 'inner-' : '';
    $output .= "\n$indent
        <div class='".$inner."nav-dropdown' style='display: block; height: 1.2534674133206636px; overflow: hidden;'>
        <div class='".$inner."drop-col'>
        <img id='prod' src='#' rel='#' alt='Womenswear'>
        <ul class='level0'>
        <li id='menu-item'>

    \n";
}
于 2013-01-01T18:07:12.683 回答