Nav_menu সাব মেনুতে ধারক যুক্ত করুন


9

আমি কি wp_nav_menu এর উল.সুব-মেনু এর চারপাশে একটি ডিভ গুটিয়ে রাখতে পারি এমন কোনও উপায় আছে?

সুতরাং উদাহরণস্বরূপ মার্কআপ থেকে যেতে হবে

<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>

এই

<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>

যেখানে "সাব-মেনু-মোড়ানো" হ'ল কাস্টম ডিভ।

এটা কি সম্ভব?

উত্তর:


21

একটি কাস্টম ওয়াকার ব্যবহার করুন , পদ্ধতিগুলি প্রসারিত করুন start_lvl()এবং end_lvl

নমুনা কোড, পরীক্ষিত নয়:

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";
    }
}

আপনার থিম ব্যবহার:

wp_nav_menu(
    array (
        'theme_location' => 'your-theme-location-EDIT-THIS',
        'walker'         => new WPSE_78121_Sublevel_Walker
    )
);

প্রতি মেনু-আইটেমের ভিত্তিতে কী পরিবর্তন করা সম্ভব? যেমন মেনু আইটেম বর্গ ভিতরে পাওয়া যায় Walker_Nav_Menuএবং এটি শিশু?
ড্যান

@Dan। হ্যাঁ, তাই
ফুসিয়া

@ ফুক্সিয়া, এই পন্থাটি কি ডাব্লুপি 5+ এর জন্য এখনও স্বাস্থ্যকর, বা আপনি কি একই জিনিসটি সম্পাদন করার জন্য কোনও বিকল্প প্রযুক্তির পরামর্শ দিচ্ছেন?
ক্লিভিস

@ Klewis এটি এখনও কাজ করা উচিত।
ফুসিয়া

এটি কেবল প্রথম স্তরে কীভাবে করা যায়।
jho1086
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.