Search bar/icon on mobile device

[Maddy]

Hi!

I am using Header style V1 and I can’t see the search bar/icon on the mobile version. Is there a way to fix this, please?

Best regards,
Maddy

[Zex]

Hello, Maddy!

This option has already been added to the new version of the theme (Current theme version is 1.4.9.3) just update your theme and you will see it.

Since we are redesigned the header in the mobile view, and now the Logo and menu are in the same line, if you want to have mobile menu below your logo (as you currently have), you need to insert additionally following codes into Customizing->General->Additional CSS:

.mobile-menu-icons{
position: relative!important;
 margin:10px;
 right:0px!important;
}   
#agama-logo{   
 flex-direction: column!important;
}

Regards

• This reply was modified 3 years, 1 month ago by Zex.
• This reply was modified 3 years, 1 month ago by Zex.

[Maddy]

Hi Zex!

Thank you so much for your prompt reply. I have indeed updated the theme and use the code you provided me. However, I still have some issues. Can you please help me display the whole menu on the mobile without using the sidebar? Can you also help me put the search icon underneath Hamburger menu? Honestly, I liked how my mobile menu looked before. I just wanted to add the search icon.

Best regards,
Maddy

[Zex]

Hello, Maddy!

Try to Insert the following codes additionally:

nav.mobile-menu{
   max-height: 100%!important;
}
.mobile-menu-icons{
  display: flex!important;
  flex-direction: column!important;
}
.mobile-menu-search{
 order: 2!important;
 margin:10px auto!important; 
 text-align: center!important;
}

Regards

[Maddy]

Hi Zex!

Thank you so much for your help!

[Author]

Posts