How can I add an image above my search bar?

Store Design
1

Hi!

How can I add an image on top of the heading search bar?

Something like this:

Wellanie_0-1640613409666.png
Wellanie_0-1640613409666.png1138×191 35.7 KB

(Website Link)

Thanks!

2

@Wellanie

can you please share store url

3

Hi there @Wellanie ,

The required result can be achieved either by hiring a developer or you’ll need to learn some basic HTML and CSS.

If you’ve some experience with HTML/CSS then go to Online Store > Themes > Edit theme code > Header.liquid file

and then search for a div with the following class (CTRL + F)

live-search--active

And below this div, you’ll need to add the code to display the required images with icons. Hope it helps

4

Hi,

I manage to add the image, and it worked.

Wellanie_0-1640839946898.png
Wellanie_0-1640839946898.png1343×296 103 KB

My problem now is, how can I fix it to look presentable in mobile view?

Wellanie_1-1640839990001.png
Wellanie_1-1640839990001.png341×353 49.1 KB

This is what I added on header.liquid


    
![Untitled-2.png?v=1640612872|1080x300](upload://gRdzuwtm3B2RVibYmDT9S41tVOa.png)

Website Link (pass: taudee)

Thanks!

5

@Wellanie

yes, please update this code
6

Perfect. Thanks!

7

@Wellanie

its my pleasure to help us