First call the wp_nav_menu function like below where you want to show your menu items.
wp_nav_menu(array(
'theme_location' => 'customerservice',
'container' => false,
'walker' => new Walker_DropDown(),
'items_wrap' => '<select>%3$s</select>',
));
Then add this nav walker function to your theme functions.php
class Walker_DropDown extends Walker_Nav_Menu{
function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
$item_output = '';
$item->title = str_repeat("&nbsp;", $depth * 4) . $item->title;
$attributes = ! empty( $item->attr_title ) ? ' title="' . esc_attr( $item->attr_title ) .'"' : '';
$attributes .= ! empty( $item->target ) ? ' target="' . esc_attr( $item->target ) .'"' : '';
$attributes .= ! empty( $item->xfn ) ? ' rel="' . esc_attr( $item->xfn ) .'"' : '';
$attributes .= ! empty( $item->url ) ? ' value="' . esc_attr( $item->url ) .'"' : '';
$item_output .= '<option'. $attributes .'>';
$item_output .= apply_filters( 'the_title_attribute', $item->title );
$output .= $item_output;
}
function end_el(&$output, $item, $depth = 0, $args = NULL){
$output .= "</option>\n";
}
}
If you want to redirect when you select the items from dropdown, then you need to add this jquery code on your js file like below:
$('select').change(function() { // add a container class before select like( $('.mainav select') ) to specify particular select field
window.location = $(this).val();
});