1

次の出力を作成するために、wordpress custom 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"><div class="drop-col">

だから私は2番目のクラスを変更する必要があり、他のクラスと言うことができます、私は気にし<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 に答える