How can I customize the search icon in Refresh Theme 12.0?

[InnoFoot]

Hello!

I'm trying to customize a my website: https://www.innofoot.be/

I was already able to change my account-icon and my cart-icon. 

And now I'm trying to customize the search icon. 

I've been searching for hours and there were some sollutions in 2022. But the theme got an upgrade to Refresh

12.0 and the the header liquid is now seperated in: header-search.liquid and header.liquid.

When I'm trying the code in both liquids, I get an error. 

Can you guys help me? 

Thanks!

[webwondersco]

@InnoFoot Could you please share the code where you add the search icon?

Also, what error you are getting when you try to update the icon?

[InnoFoot]

Hello!

Thanks for the quick response.

The code that I was using was: 

<a class="modal__toggle-open icon icon-search" aria-hidden="true" focusable="false" role="presentation" href="#icon-search">
<img src="{{YOUR_IMAGE_URL}}">
</a>

I found it on this community page: https://community.shopify.com/c/shopify-design/change-search-icon-magnifying-glass-in-refresh-theme/...

But when I do that, my whole header is glitched with all different letters on it: 

Thanks in advance! 

[webwondersco]

you are missing something.

If you don't mind, can take a look at your theme code?

[InnoFoot]

What should I've been looking to in my theme code?