Whishlist Icon custom

Hi,
I’d love to have the wishlist icon always visible on the product archive (currently visible only on hover).

Additionally, I’m interested in using a different icon for before and after adding an item to the wishlist. Is it possible to upload my own images or choose from a selection of new icons, such as a white heart or a red heart?

Thank you <3

Attachments:

You must be logged in to view attached files.

Hi izabeladaiana766,

Thanks for reaching to us.

Please add the following Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

/* Keep Wishlist always visible */
.wd-quick-shop .wd-buttons[class*="wd-pos-r"] {
    opacity: 1;
    visibility: visible;
    transform: none;
}

/* Change Wishlist icon */
.wd-quick-shop .wd-action-btn>a.added:before {
    content: "\f134";
}

In order to see full list of WoodMart icons, go to Theme Settings > Typography > Icon fonts. Then, you can replace with your like icons. https://prnt.sc/TBJ6FcbKvhhX

Regards,

Hi,
I would like a filled heart or a red heart onto ‘added to wishlist’ action. There is no such icon in fonts.

Thankiess <3

[Hung Pham]

Hi izabeladaiana766,

There are no solid icons with WoodMart icons. You can try below methods:

– Navigate to Elementor > Settings > Advanced tab and enable Load Font Awesome 4 Support option https://prnt.sc/kSegrN7ToMiT

– Remove previous CSS code and use below one:

/* Keep Wishlist always visible */
.wd-quick-shop .wd-buttons[class*="wd-pos-r"] {
    opacity: 1;
    visibility: visible;
    transform: none;
}

/* Change Wishlist icon to Solid by using FontAwesome icons */
.wd-quick-shop .wd-wishlist-icon>a:before,
.wd-quick-shop .wd-action-btn.wd-wishlist-icon>a.added:before{
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
  content: "\f004";
}

/* Change added Wishlist icon color */
.wd-quick-shop .wd-action-btn.wd-wishlist-icon>a.added:before{
	color: #FF0000;
}

https://prnt.sc/ahgiQ6D48cn9

Regards,

• This reply was modified 1 month, 2 weeks ago by Hung Pham.

Thank you very much,
I am amazed that every solution provided was working properly. Thank you for doing such great job <333

Hi izabeladaiana766,

Glad to hear your issue has been resolved. Keep us in mind for future questions and concerns, we’re always here to help!

If you have a quick minute we always appreciate a 5-star rating on our theme!

https://themeforest.net/item/woodmart-woocommerce-wordpress-theme/reviews/20264492

Your feedback is the motivation to improve our work and services.

Regards,

[Author]

Posts