Search bar not appearing on mobile

Solved
Gunay_Zort
Excursionist
18 0 5

Hi,

I realized recently that the search bar is not showing when our website is visited on mobile. Desktop version appears correctly. I have attached below the images of desktop, mobile and expected mobile versions of our website. The third image is from the woo commerce version of our website where the search bar appears correctly. Also, I realized that the currency selector we have appears a bit higher than it should and it makes it more difficult for mobile customers to view the account page. Our website URL is www.youthandearth.com. I know that it might be a complicated issue, but any suggestions will be appreciated.

Regards,

Gounay

Gunay_Zort_0-1627475196328.pngGunay_Zort_1-1627475233208.png

 

Gunay_Zort_2-1627475315236.png

 

0 Likes

Hello,
you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community!

I have gone through your store , you can set your currency in the left site. like this i have shared screenshot.

also your search icon is hided for mobile view!

oscprofessional_1-1627477525826.png

 

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
Pallavi
Shopify Expert
2382 397 516

This is an accepted solution.

Hello There,

1.In your Shopify Admin go to online store > themes > actions > edit code
2.Find Asset >theme.scss.css and paste this at the bottom of the file:

@media screen and (max-width: 991px) and (min-width: 750px) {
.site-header__icons-wrapper .site-header__search-toggle {
padding: 5px 15px !important;
display: flex;
align-items: center;
}
}
@media screen and (max-width: 749px){
.site-header__icons-wrapper .site-header__search-toggle {
display: block;
position: absolute;
left: 13px;
top: 11px;
}
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
Gunay_Zort
Excursionist
18 0 5

Hi Pallavi,

Thanks for your response and help. The currency switcher is working perfectly now.

Regards,

Gounay

Gunay_Zort
Excursionist
18 0 5

Hi ,

Thanks for your response.

Regards,

Gounay

0 Likes
Pallavi
Shopify Expert
2382 397 516

Thank you for your response. It's good to know that it's worked for you. Kindly feel free to get back to me if you need any further assistance.

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing