Shopify Dawn Default Theme - Search Icon Removal

[Orihov]

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

[Zworthkey]

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

[prasanna1991]

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

[KetanKumar · 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;
}

[Susan_Blue]

This works!!! Thank you!

[cj18]

hello. do you have the solution for wanting to remove the "person" icon in the header. 

[KetanKumar]

@cj18 

oh sorry for that issue, can you please send store url so i will check and let you know 

[cj18]

https://crystallation.com/

Also, im looking to add a section with a icon list and headers any thoughts? similar to the below

[KetanKumar]

@cj18 

first issue please add 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--account {
    display: none !important;
}

 also do you need second icon section it can be done customization code please send DM Details 

[Zworthkey]

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.

[HamishDavisonIC]

@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:

First go to edit your code

go to base.css

add this code at the bottom

.header__icon--search {
    display: none;
}

Before

After

And we are done!

[gnome_sayin]

If you are referring to disabling the search feature in Dawn 3.0.0, you can do that in the editor.  

Header -> Header settings -> Uncheck 'Enable Search'

No code changes needed

[ahmedhuang]

@KetanKumar Yes, you are right. Actually, all Shopify 2.0 themes like Refresh, Taste, Craft, and Sense can use this CSS code. Meanwhile, we can edit the Liquid code too. Here is a step-by-step tutorial of how to do it:

https://www.shopifylover.com/how-to-remove-search-bar-from-shopify/

hope it can help someone.

[KetanKumar]

@ahmedhuang 

wow that would be great 

Thanks for sharing 

[v_vashisth]

Hello we can remove seach icon by css as well by comment code of search from website, I created a complete article for that so you can follow instructions here : https://www.blog.standincrowd.com/shopify-dawn-theme-remove-search-icon-from-header/