How can I remove the search bar in the simple theme?

How would I go about removing the search bar in the simple theme? If anyone could give me step by step that would be great. From what I have seen doing it on other themes is quite easy but haven’t been able to find anyone removing it on simple theme.

please share a store url better to assist

@CSCOTT23

Click on Actions > Edit Code.

Find/Search for theme.scss.liquid file.

Scroll at the very bottom of this file and put the following code there.

.top-bar .top-bar__search{
    display: none !important;
}
2 Likes

is there a way to keep the Cart icon in the same place when using this solution? It currently jumps a couple of inches to the left when this code is applied. Thanks.

Hey @UGshop , instead of:

display: none !important

Use :

visibility: hidden !important

This is because display: none does not acknowledge there is an object, and moves up the next object in the document. With visible, the document still acknowledges there is an object on the page, but it is not loaded.

This solution removes the icon, but if your mouse scrolls over the same place the icon changes to the pointer hand and if you click it brings up the search function.

At the very bottom of theme.scss.liquid enter following code:

metaartoid_0-1653819042988.png

hello, I have made a collection of how to remove search bar from 10+ themes (including Simple). If you guys are interested, please have a look:

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