How can I modify the search bar in the Dawn theme?

[MaxiMaxi]

Hi there,

I would like to change the “search Bar” and can’t seem to find a way to do this.

Hope someone has come up with a solution for this, would really appreciate the help.

I am looking for something like this, which opens like a dropdownwith full header width.

Maxi-Brillian (maxibrillian.com)

pw: deropa

[pankaj-gurbani]

Hello,

This can be done easily by editing the code of your theme. If you have a custom theme, I can help you with that if you want.

However, if you have the Dawn theme installed here are the exact steps -

1. Open Shopify Admin for your store.
2. Click Online Store in the left sidebar under sales channels.
3. Select themes.
4. You can see the theme that’s currently installed you your store.
5. Click the 3 dots on the left of customize button
6. Select Edit code
7. Open file Assets → base.css
8. Press Ctrl + F (windows) or Cmd + F (mac) to find a word
9. Type .search-modal__content in the search bar and press enter
10. You should find a block in this format “.search-modal__content { … }”
11. Inside this block, remove this line - “justify-content: center;”
12. Save the file
13. Now search for “.search-modal__form”
14. There would be multiple search results, look for the block that’s contained in another block starting with the “@media screen” query.
15. Now remove the whole “.search-modal__form { .. }” block inside the @media screen block.
16. Save the file.
17. Done.

[MaxiMaxi]

Thank you for your help.

i tried your instructions and i get this result.

Now i have a width search bar, which i was looking for, but i wanted the exact design wich i posted.

LIKE THIS Marc Gebauer – Marc Gebauer Lifestyle GmbH