Tambahkan wadah ke sub menu nav_menu

9

Apakah ada cara saya bisa membungkus div di sekitar menu ul.sub wp_nav_menu

Jadi misalnya markup akan pergi

<ul class="menu">

    <li><a href="/">Item 1</a></li>
    <li>
        <a href="/">Item 2</a>

        <ul class="sub-menu">

            <li><a href="/">Item 1</a></li>
            <li><a href="/">Item 1</a></li>

        </ul>
   </li>
    <li><a href="/">Item 1</a></li>
    <li><a href="/">Item 1</a></li>

</ul>

untuk ini

<ul class="menu">

    <li><a href="/">Item 1</a></li>
    <li>
        <a href="/">Item 2</a>

        <div class="sub-menu-wrap">

            <ul class="sub-menu">

                <li><a href="/">Item 1</a></li>
                <li><a href="/">Item 1</a></li>

            </ul>

        </div>

   </li>

    <li><a href="/">Item 1</a></li>
    <li><a href="/">Item 1</a></li>

</ul>

Di mana "sub-menu-wrap" adalah div khusus.

Apakah ini mungkin?

Dean Elliott
sumber

Jawaban:

21

Gunakan alat bantu jalan khusus , perpanjang metode start_lvl()dan end_lvl.

Kode sampel, tidak diuji:

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

Penggunaan dalam tema Anda:

wp_nav_menu(
    array (
        'theme_location' => 'your-theme-location-EDIT-THIS',
        'walker'         => new WPSE_78121_Sublevel_Walker
    )
);
fuxia
sumber
Apakah mungkin untuk melakukan perubahan pada basis per-menu-item? mis. apakah kelas item menu tersedia di dalam Walker_Nav_Menudan itu anak-anak?
Dan.
@Dan. Ya itu.
fuxia
@ Fluxia, apakah pendekatan ini masih sehat untuk WP 5+, atau apakah Anda merekomendasikan teknik alternatif untuk mencapai hal yang sama?
klewis
@ KLewis Ini masih bisa digunakan.
fuxia
Cara melakukan ini hanya di level pertama.
jho1086