Change the default heart icon

Hi billinflames,

There is an option in color panel to change “Add to wishlist” icon; be sure to check “Use buttons instead of simple anchors” and uncheck “Use the theme style”.

If font-awesome icons doesn’t fit your needs, or your theme overwrite default plugin behaviour, you can overwrite add-to-wishlist.php and add-to-wishlist-button.php templates, simply copying them in your theme’s root.

Remove <?php echo $icon ?> to prevent default icon to be printed, and add any image you prefer

Let me know if this helps you
Have a nice day ??

Hello,

it seems to be very strange! You told me two solutions but none of them works for me!

Font awesome has a lot of icons that i like but none of them appears when i change it! It has the heart again!

I was trying to replace <?php echo $icon ?> with <img src=”link..to..image” /> but it stills have the default heart!

Hi again!

can you please try with Twenty default wordpress theme? I ask you to do this test to exclude any theme interference with default plugin behaviour.

Let me know
Have a nice day!

I activate the twenty theme but i can’t see the wishlist icon.

Hi again,

That’s really strange, as on my local installation all seems to work well on twenty theme: here some screenshot of my configuration and frontend result

https://screencast.com/t/z1bqq0Rv3XF
https://screencast.com/t/YSeJFl4g5BRU
https://screencast.com/t/0Hp1vmEBk

Can you share with us a link where I can check the problem?
Let me know!

Have a nice day ??

Xmm..

sure, here is a link,
https://monastiriako-perivoli.gr/ pass: shop123

I have checked the ‘Use buttons instead of simple anchors’ and unchecked the ‘Use the theme style’ :/

Uhm

Just checked your installation, and I see your icon hidden by flatsome theme css (it is really strange it doesn’t shows up on Twenty)

Anyway, I think some css can resolve you problem ?? Just add this code at the end of the style.css file of your theme

.yith-wcwl-add-to-wishlist a.add_to_wishlist{
    padding: 2px 0!important;
}

.yith-wcwl-add-to-wishlist a.add_to_wishlist:before{
    content: '';
    display: none!important;
}

.yith-wcwl-add-to-wishlist a.add_to_wishlist img{
    float: right;
}

Let me know if this helps you
Have a nice day ??

Thank you so much! It works fine!

Keep up the good work!

Have a nice day too!

Glad to hear good news ??

If you have appreciated our plugin and our help, please don’t forget to give us a 5-star vote, and consider buying our premium version: here you can find more information about it, and here you can try a live demo of the plugin. ??

Hi,
Your css solution seem to work fine! However the hart is still there on the “browse wishlist”-link and in the product listings. Is it possible to hide those too?
I tried with
.yith-wcwl-wishlistexistsbrowse a::before{
display: none!important;
}
but then the text “browse wishlist” disappeared too.

Hi patrick356,

I’m pretty sure we can resolve your problem with some custom css; anyway, a link where to check your installation would really help me solve it.

Can you share with us an url to your wordpress/wishlist installation?
Let me know!

Have a nice day ??

Thank you for the great plugin!! I have been struggling trying to change the default heart icon to the male icon but I can’t figure out. I followed all the directions above and put this in the css style sheet:

.yith-wcwl-add-to-wishlist a.add_to_wishlist{
padding: 2px 0!important;
}

.yith-wcwl-add-to-wishlist a.add_to_wishlist:before{
content: ”;
display: none!important;
}

.yith-wcwl-add-to-wishlist a.add_to_wishlist img{
float: right;
}

This removes the heart but now the button is just black with no icon in it. When I change none to show after display: it shows the heart again. Is there a particular css code can I add to above to input the male icon or any other icon?

Great plugin by the way again!

Thank you!

Sam

Hi Sam,

Unfortunately, make general css code, that suits every theme, is very difficult, so I would like to check your site

Can you please share an url where I can check your problem?

Let me know
Have a nice day