একটি সিলেক্ট মেনু ড্রপডাউন তৈরি করতে wp_nav_menu কীভাবে ব্যবহার করবেন?

Question

আমি wp_nav_menuএকটি নির্বাচিত ড্রপডাউন মেনু তৈরি করতে ফাংশনের অভ্যন্তরে নিম্নলিখিতটি ব্যবহার করছি যেখানে প্রতিটি মেনু আইটেমটি সিলেক্ট ড্রপডাউনতে একটি বিকল্প ...

'items_wrap' => '<select>%3$s</select>'
'before'     => '<option value="">'
'after'      => '</option>'

আমি কীভাবে 'before'ঘোষণায় লিঙ্কটির মান যুক্ত করব ? এই সম্পর্কে আরও ভাল উপায় আছে? আমি জানি wp_dropdown_pages, তবে এটি কার্যকর হয় না কারণ আমি চাই ব্যবহারকারীরা "মেনু" পৃষ্ঠা থেকে মেনুটি নিয়ন্ত্রণ করতে সক্ষম হন।

Answer 1

আপনি wp_nav_menu দিয়ে এটি করতে পারবেন না, কারণ এটি তালিকার আইটেমগুলিকে আউটপুট দেয় এবং আপনি আপনার কোড দিয়ে অবৈধ মার্কআপ জেনারেট করে।

ব্যবহার করার চেষ্টা করুন wp_get_nav_menu_items () পরিবর্তে।

---

কাস্টম ওয়াকার সহ ড্রপ ডাউন মেনুর জন্য দ্রুত সমাধান:

class Walker_Nav_Menu_Dropdown extends Walker_Nav_Menu{

    // don't output children opening tag (`<ul>`)
    public function start_lvl(&$output, $depth){}

    // don't output children closing tag    
    public function end_lvl(&$output, $depth){}

    public function start_el(&$output, $item, $depth, $args){

      // add spacing to the title based on the current depth
      $item->title = str_repeat("&nbsp;", $depth * 4) . $item->title;

      // call the prototype and replace the <li> tag
      // from the generated markup...
      parent::start_el(&$output, $item, $depth, $args);
      $output = str_replace('<li', '<option', $output);
    }

    // replace closing </li> with the closing option tag
    public function end_el(&$output, $item, $depth){
      $output .= "</option>\n";
    }
}

আপনার টেম্পলেটগুলিতে এটি ব্যবহার করুন:

wp_nav_menu(array(
  'theme_location' => 'primary', // your theme location here
  'walker'         => new Walker_Nav_Menu_Dropdown(),
  'items_wrap'     => '<select>%3$s</select>',
));

Comments

আসলে, "আইটেম_রাপ" অংশটি ব্যবহার করার সময়, তালিকার আইটেমগুলি সরিয়ে দেয়, তাই মার্কআপ ঠিক আছে। আমি যদিও লিঙ্কটি চেক আউট করব। ধন্যবাদ!

— ক্রিস মোলিটার 21

হ্যাঁ, তবে এটি নেস্টেড <UL>গুলি :) পরিচালনা করে না :)

— onetrickpony

এটি আসলে :-) করে

— ক্রিস মোলিটার

উত্স অনুসারে এটি

— হ'ল

এটি কি কাজ করে না?

— ক্রিসজলি

Answer 2

আমি যে দরকারী খুঁজে পেয়েছি:

CSS কোড ড্রপডভন মেনু সরল করতে আপনি যে কোনও প্রতিক্রিয়া অনুসরণ করতে পারেন।

1. parentসাবমেনু রয়েছে এমন আইটেমগুলির জন্য একটি ক্লাস যুক্ত করুন
2. অ্যাড depthশ্রেণী (depth0, depth1, depth2 ...)

আপনার থিম ফাংশন.এফপি যোগ করুন

class DD_Wolker_Menu extends Walker_Nav_Menu {
    function display_element( $element, &$children_elements, $max_depth, $depth=0, $args, &$output ){
        $GLOBALS['dd_children'] = ( isset($children_elements[$element->ID]) )? 1:0;
        $GLOBALS['dd_depth'] = (int) $depth;
        parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );
    }
}
add_filter('nav_menu_css_class','add_parent_css',10,2);
function  add_parent_css($classes, $item){
     global  $dd_depth, $dd_children;
     $classes[] = 'depth'.$dd_depth;
     if($dd_children)
         $classes[] = 'parent';
    return $classes;
}

এখন header.php এ

wp_nav_menu( array( 'container_class' => '','container' => '',  'menu' => 'header-menu', 'walker'=> new DD_Wolker_Menu ) );

header-menu আপনার মেনু এর নাম দ্বারা প্রতিস্থাপিত

সিএসএস উদাহরণ কোড হতে পারে

#menu-header-menu{
    margin: 0;
    padding: 0;
}
#menu-header-menu  ul{

}

#menu-header-menu> li{
    display: inline;
    margin-left: 1.618em;
}
#menu-header-menu  li{
    list-style: none;
}
#menu-header-menu  li a{
    text-decoration: none;
    font-size:  1em;
    font-family:    'Lato',Helvetica,Arial,sans-serif ;
    letter-spacing: 1px;
}
#menu-header-menu li.parent::after{
    content:'+';
}

#menu-header-menu  .sub-menu {
   display: none;
   position: absolute;
   background-color: #fff;
}

#menu-header-menu  li:hover>.sub-menu{
    display: inline;
    width: auto;
    height: auto;
    border: solid 1px #BBBBBB;
    z-index: +1;
}

কোথায় #menu-header-menu- প্রধান ইউএল তালিকা আইডি (আপনার পাশাপাশি এটি আপডেট করা প্রয়োজন)

Answer 3

ড্রপডাউন মেনু প্লাগইন করে প্রশ্নের উত্তর দাও wp_nav_menuনির্বাচন মেনু ড্রপডাউন তৈরি করতে ব্যবহার করা যাবে না, যেহেতু প্লাগইন ছিমছাম উপলব্ধ dropdown_menu()ফাংশন যা কাজ প্রশংসনীয়রূপে আছে।