Shopify Dawn Default Theme - Search Icon Removal

Solved
Orihov
New Member
3 0 1

Hi! Does anyone know whats the easiest way to remove search icon from the header in Shopify's Dawn default theme?

hii, @Orihov 
Kindly share your store URL so,
I can solve your issue.
Thank You.

If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme,
Hire us. or Want to know more. Read our Shopify Blogs.Email us: sales@zworthkey.com
Buy me a coffee ☕ Donate Us
0 Likes

Hi @Orihov,

Hope you are well.

Please follow the below steps:

  1. Go to Online Store->Theme->Edit code
  2. Asset->/base.css
  3. Paste the below code at the bottom of the file & Click Save

 

.header__search {
    display: none!important;
}

 

Hope that helps.

Thanks

- Want to modify or custom changes on store Hire me.
- Feel free to contact me on prasanna.mahamulkar@gmail.com regarding any help.
- If helpful then please Like and Accept Solution.
Shopify Frontend Web Developer | Whatsapp Me
0 Likes
KetanKumar
Shopify Partner
23196 2339 8589

This is an accepted solution.

@Orihov 

can you please try this code

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

.header__icon--search {
    display: none;
}

 

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

hii, @Orihov 
Paste this code on top of the base.css file.

summary.header__icon.header__icon--search.header__icon--summary.link.link--text.focus-inset.modal__toggle {
    display: none !important;
}

Thank You.

If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme,
Hire us. or Want to know more. Read our Shopify Blogs.Email us: sales@zworthkey.com
Buy me a coffee ☕ Donate Us
0 Likes
HamishDavisonIC
Excursionist
48 5 24

@Orihov 

 

How to remove the search icon from Dawn’s header

You might want to do this if you don’t have any need for the search in the header

It can look stupid — and sometimes you just don’t want it to appear in the header because it’s appearing somewhere else

 

In this case, it’s incredibly easy to change, just follow these steps:

HamishDavisonIC_0-1631800078498.png

 

First go to edit your code HamishDavisonIC_1-1631800078099.png

 

go to base.css HamishDavisonIC_2-1631800078049.png

 

add this code at the bottom

.header__icon--search {
display: none;
}

HamishDavisonIC_3-1631800078066.png

 

Before HamishDavisonIC_4-1631800078073.png

 

After

And we are done!