Solved

Missing search button on mobile

PetrMachacek
Explorer
71 1 18

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)

KetanKumar
Shopify Partner
36839 3635 11972

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 7 (7)

ZestardTech
Shopify Expert
5393 970 1291

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
Zworthkey
Shopify Partner
5581 642 1565

@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;
}

 

KetanKumar
Shopify Partner
36839 3635 11972

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
PetrMachacek
Explorer
71 1 18

Amazing worked like charm 😄

KetanKumar
Shopify Partner
36839 3635 11972

@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
hannah17
Visitor
1 0 0

I dont have a theme.css file what should i do?

 

iCart_App
Shopify Partner
479 57 103

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.

iCart Cart Drawer Cart Upsell 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