How to use my own icon in featured item setting?

[marie-soleil]

Hi,

I would like to use my own icon in the feature item (see image attached).

Is there a way to do this? It seems I only have acces to a pre-selected icon list.

 

Thanks!

[sharmstr]

Is your icon a font icon or an image?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[marie-soleil]

an image

[sharmstr]

You need to add custom css to the page that will change the icon to your image. In the example below, I’ve changed the bitcoin icon to an image on my server

COPY CODE

.icon-bitcoin:before {
    content: url('http://localhost:8080/kleo/wp-content/uploads/2015/12/Attractions.png');
}

You can find the name of the icon by right clicking on it and inspecting. Make sure you add the css to the page by clicking on the gear icon. If you add it in quick css or your child theme, it will apply the change site wide instead of on the page itself.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[marie-soleil]

Ok, I done the test. But the result is not really nice. (See the attachement).
Would it be the same approach if a use an icone?

Thanks,
Marie-Soleil

[sharmstr]

add this to the css to align it

COPY CODE

    margin-left: -30px !important;

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[marie-soleil]

It’s working, thanks a lot! 🙂

[sharmstr]

You’re welcome.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Author]

Posts