search bar icon

[Mymymy]

hello there

I was wondering if there’s a way I can change the search ‘magnifying glass’ icon?

looking forward to hearing form you.

[SeaTheme]

Hi there,

Welcome to SeaTheme forum.

The search ‘magnifying glass’ icon uses Fontawesome, it is possible to replace it by CSS ( “Appearance > Customize: Additional CSS):

.search-top-btn-class .fa,
.search-icon-header {
   display: block;
    width: 30px;
    height: 30px;
}
.fa-search:before {
    content: "";
    background: url(https://replaced-icon-file-url) no-repeat;
    background-size: 100%;
    width: 100%;
    height: 100%;
    display: block;
}

* https://replaced-icon-file-url is the icon file URL, you can use PNG or SVG format image

If it doesn’t work, please leave the issued page URL.

---

Regards!
SeaTheme – FAQs – WordPress Customization – Facebook

[Mymymy]

Thanks for this. I can see
<i class=”fa-light fa-magnifying-glass”></I>
but not a URL. Would this work?

[SeaTheme]

Welcome.
Please try to update the above CSS as:

.fa-magnifying-glass {
   display: block;
    width: 30px;
    height: 30px;
}
.fa-magnifying-glass:before {
    content: "";
    background: url(https://replaced-icon-file-url) no-repeat;
    background-size: 100%;
    width: 100%;
    height: 100%;
    display: block;
}

Please leave your webpage URL if it does not work.

---

Regards!
SeaTheme – FAQs – WordPress Customization – Facebook

[Author]

Posts