How to improve search bar design for mobile and desktop?

Store Design
, ,
1

Hi!

i am struggeling with my search bar. It does not look good on neither mobile or desktop, and i dont have much time before store opening. Is it someone good at searchbar-difficulties og design that would take on a job?

2

Hi @Benkor_1

Can you drop your store link here?

3

password backofficekorse

4

Hi @Benkor_1

You can try to add this code to your theme.liquid file before tag and check if it ok
5

Thanks! Is it posible to have it outlined so its more visible on white background?

6

Update code to this
7

If i want just and underline and not total border, can i do that?

8

Yes, it can be. Code updated
9

Is it possible to have the search bar placed over the logo and menu bar?

10

Update code

Mobile:

Screenshot 2023-11-02 at 15.23.53.png
Screenshot 2023-11-02 at 15.23.53.png394×335 108 KB

Desktop:

Screenshot 2023-11-02 at 15.24.04.png
Screenshot 2023-11-02 at 15.24.04.png1377×428 375 KB

11

Thank you so much for taking the time!

1 Like
12

You are very welcome, @Benkor_1