How do I move or remove the search from the top of my Storefront?

  • 0
  • 1
  • Question
  • Updated 4 years ago
  • Answered
This article will show some advanced steps to take within the template to hide the search from the header of your website. Here is what my header looks like with the search showing up in the top right corner.


Video Overview

1.) Login to your store's control panel.

2.) Click on Design.


3.) Click on the Template Files tab.


4.) Scroll down to the Styles folder and click the plus sign next to it.


5.) Then click Edit next to styles.css.


6.) Then search for the line that reads #SearchForm {


7.) You will then need to insert visibility: hidden; after the #SearchForm { and before float: right; (as shown in the image below):


8.) Make sure to save changes by clicking on the Save option in the top left corner of the page.


Here is what my header looks like after I have done the above steps. The red box is outlining where the search was at, but is now hidden.


Photo of Drew N

Drew N, Community Manager

  • 243,976 Points 100k badge 2x thumb

Posted 4 years ago

  • 0
  • 1

Be the first to post a reply!