add search button to mobile nav bar

is it possible to add a search button for mobile nav bar ?

or like when click this button , as my screenshot , it will pop up the mobile category where it contains the search bar and auto-focus it ?

Attachments:

You must be logged in to view attached files.

Hello,

Sorry but there is no option in Theme Settings available for that.

You can only add the mobile category menu to the Mob Nav bar but not the search as you want. You can only add simple buttons with custom URLs.

Best Regards.

in case anyone hit same issue on me , here is my solution

/* Custom button with #focustosearch anchor for focus to search input on mobile */
(function($) {
 $('.wd-tools-custom-icon, .wd-toolbar-item').each(function (i,div) {
  if ($(div).find('a[href="#focustosearch"]').length > 0) {
   $(div).find('a[href="#focustosearch"]').click(function (event) {
    event.preventDefault();
    var menubtn = $('.wd-header-mobile-nav:first').find('a:first');
    if(menubtn.length){
     menubtn[0].click();
     var side = document.querySelector(".wd-side-hidden-nav");
     setTimeout(function(){ 
      side.classList.contains("wd-opened") ? $('.wd-close-side.wd-fill').addClass("wd-close-side-opened") : '';
     }, 9);
    }
    $('.mobile-nav').find('.searchform').find('input:first').focus();
   });
  }
 });
})(jQuery);

add this to custom JS , then custom button set URL to #focustosearch

then click it will auto pop up the mobile menu , and focus onto the search box with keyboard also pop up and ready for input

Hello,

Thank you very much for sharing the solution with all of us.

Have a great day.

Topic Closed.
Best Regards.

[Author]

Posts