search box in header on mobile

Hi Boris!

Thank you for using Enfold.

You can add the search box inside the mobile menu. Add this in the functions.php file:

add_filter( 'wp_nav_menu_items', 'avia_append_search_nav', 10, 2 );

function avia_append_search_nav ( $items, $args )
{

		if ($args->theme_location == 'avia') {
	        $search_form = get_search_form(false);
			$items = '<li id="menu-item-searchbox">'.$search_form.'</li>' . $items;
    	}
		return $items;
}

And this code in the Quick CSS field:

#menu-item-searchbox form div {
display: block !important;
opacity: 1 !important;
width: auto !important;
}

#menu-item-searchbox form div #s {
    width: 300px !important;
    max-width: 300px;
}

#menu-item-searchbox {
top: 25px;
}

#top #searchsubmit, .ajax_load {
    right: 0px;
}

Regards,
Ismael

Hi Boris,

Please try it at the end to see if you have any luck with it.

Best regards,
Rikard

Hi,

No it should work simply copy/pasting it, not sure what your functions.php file looks like but the only thing to look out for it to not paste it after the end php code, it there is one:

?>

Thanks,
Rikard

Hi,

If it works without one all is good, if it doesn’t work then please try to add it to see if that works better.

Regards,
Rikard