How can I convert a search bar into a search icon?

Store Design
, , , ,

Topic summary

A user wants to convert their existing search bar into a simple search icon positioned in the top right corner next to the shopping cart icon.

Current Status:

  • The search bar is already functional and activated in header settings
  • The theme doesn’t have an “add-ons” section

Request:

  • Looking for the easiest method to replace the full search bar with just an icon
  • Seeking CSS customization advice or alternative solutions

Note: The discussion appears to contain corrupted or reversed text in parts of the messages, making some details unclear. The core question remains open with no solution provided yet.

Summarized with AI on November 13. AI used: claude-sonnet-4-5-20250929.
1

Hi,

I would like to change the search bar on my theme to a simple search icon, ideally in the right top corner next to the shopping bag.

Any thoughts on if that would be possible and what would be the easiest way to do that?

I found many posts and videos on how to change an icon into a bar but not the opposite.

Thank you, any help is much appreciated!

bananarama

Screen Shot 2023-12-27 at 11.33.14 AM.png
Screen Shot 2023-12-27 at 11.33.14 AM.png3492×250 55.2 KB

bananarama

2

Hi @MBilal ’

My search bar is already working.

I don’t have an “add-ons” section but I have activated it in my header settings and it is working.

But my question was, would it be possible to change it to an icon only. Thank you.