search box in mobile menu

Hey vbonora,

Thank you for the inquiry.

This is possible but the AJAX search functionality will not work, so it is going to be a normal search field where you have to check the results in the actual search page.

To add the search form in the menu, please add these functions in the functions.php file.

add_filter( 'wp_nav_menu_items', 'avf_add_search', 9999, 2 );
function avf_add_search( $items, $args ) {
	if ($args->theme_location == 'avia')
	{
		$search = '<li id="menu-item-search-mobile" class="menu-item"></li>';
		$items = $search . $items;
	}
	return $items;
}

add_action('wp_footer', 'avf_add_search_script');
function avf_add_search_script(){
?>
<script type="text/javascript">
(function($) {
	$('.av-burger-menu-main').on('click', function() {
		var page   = window.location.href;
		var mobile = $('.menu-item-search-mobile');
		var search = '<form action="'+page+'" method="get" class=""><div><input type="submit" value="?" id="searchsubmit" class="button avia-font-entypo-fontello"><input type="text" id="s" name="s" value="" placeholder="Search"></div></form>';

		setTimeout(function() {
			if(mobile.find('form').length == 1) return;
			mobile.html(search);
		}, 500);		
	});
})(jQuery);
</script>
<?php
}

Then use this css code to adjust the style of the search field.

#top #wrap_all #header #av-burger-menu-ul>li.av-active-burger-items.menu-item-search-mobile {
	padding: 0 30px;
	position: relative !important;
}

#top #wrap_all #header #av-burger-menu-ul>li.av-active-burger-items.menu-item-search-mobile form {
	position: relative !important;
}

Best regards,
Ismael