Missing search button on mobile

Solved
PetrMachacek
Explorer
62 1 17

Dear Shopify experts,

I would like to ask if you know a way how to resolve following issue.

 

My eshop www.doramu.cz has search icon when browsing on the PC. However when I open the page on mobile the search icon is missing. I assume it would not fit, but can I make icons at the same time smaller?

 

Thanks,

Petr

Accepted Solution (1)

Accepted Solutions
KetanKumar
Shopify Partner
31218 3117 10466

This is an accepted solution.

@PetrMachacek 

sorry for that issue can you try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.

 

@media screen and (max-width: 640px) {
a.Header__Icon.Icon-Wrapper.hidden-phone.Icon-Wrapper--clickable {
    display: inline-block !important;
}
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

Replies 6 (6)
ZestardTech
Shopify Expert
3327 549 760

Hello There,

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

a.Header__Icon.Icon-Wrapper.hidden-phone.Icon-Wrapper--clickable {
display: inline-block !important
}
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
KetanKumar
Shopify Partner
31218 3117 10466

This is an accepted solution.

@PetrMachacek 

sorry for that issue can you try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.

 

@media screen and (max-width: 640px) {
a.Header__Icon.Icon-Wrapper.hidden-phone.Icon-Wrapper--clickable {
    display: inline-block !important;
}
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Zworthkey
Shopify Partner
5581 640 1498

@PetrMachacek 
1. Navigate to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.

 

a.Header__Icon.Icon-Wrapper.hidden-phone.Icon-Wrapper--clickable {
    display: inline-block !important;
}

 

If helpful, please Like and Accept Solution. Hire Us |
if you Want to modify or Customize your theme | Whatsapp | Email us: sales@zworthkey.com
Top Rated Shopify Agency, | We have Over 200+ Happy merchants.
Build Successful Shopify Stores with GemPages
BinalSavani
Shopify Partner
360 48 83

Hello @PetrMachacek!

Hope you are doing well.

Please add the below code in the theme.css theme file at the bottom to make it work as you need:

@media screen and (max-width: 640px){
.hidden-phone {
    display: block !important;
}
span.hidden-phone {
    display: none !important;
}
}

Hope this will help you out.

Binal Savani | iCart App


- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution!
- To learn more visit www.identixweb.com
PetrMachacek
Explorer
62 1 17

Amazing worked like charm 😄

KetanKumar
Shopify Partner
31218 3117 10466

@PetrMachacek 

its my pleasure to help us 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing