You can’t do this with wp_nav_menu, because it outputs list items, and you’ll generate invalid markup with your code. Try using wp_get_nav_menu_items()
instead.
A quick solution for a drop down menu with a custom walker:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | 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(" ", $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"; } } |
In your templates use it like this:
1 2 3 4 5 | wp_nav_menu(array( 'theme_location' => 'primary', // your theme location here 'walker' => new Walker_Nav_Menu_Dropdown(), 'items_wrap' => '<select>%3$s</select>', )); |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.