Custom icon compare wishlist

This topic has 13 replies, 3 voices, and was last updated 1 month ago by Bogdan Donovan.

Viewing 14 posts - 1 through 14 (of 14 total)

Author

Posts
January 20, 2025 at 3:06 pm #631151

apps.matteo
Participant

Hi, I need to change the comparison icon with the favorites list icon.
Leave the screenshots of what I need, which I ask for advice.
Thanks.
Matteo

Attachments:
You must be logged in to view attached files.

January 20, 2025 at 3:59 pm #631177
Hung Pham
Keymaster
Hi apps.matteo,

Thanks for reaching to us.

1. Changing icon

Please add the below Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:
```
div.wd-compare-icon>a:before{
	content: "\f106";
}
```
2. Product grid

Navigate to Theme Settings > Shop > Wishlist and enable Enable wishlist option.

Regards,
January 20, 2025 at 4:55 pm #631204

apps.matteo
Participant

Thanks for the reply Hung,
Great for the icon, but the text next to it still doesn’t change when you hold the mouse over it for (1)

2) the text next to the icon still appears

Attachments:
You must be logged in to view attached files.

January 21, 2025 at 1:27 pm #631465

Hung Pham
Keymaster

Hi apps.matteo,

Please remove all above Custom CSS, go to Theme Settings > Shop and enable Wishlist option only.

Regards,

January 21, 2025 at 2:19 pm #631498

apps.matteo
Participant

Good morning I did it and everything is as before by default.
What’s the point?

January 21, 2025 at 2:20 pm #631499

apps.matteo
Participant

Hi, I did it and everything is as before by default. What’s the point?

January 21, 2025 at 7:15 pm #631650

apps.matteo
Participant

It’s back to normal and now what do I do?

January 22, 2025 at 6:51 pm #631937

Hung Pham
Keymaster

Hi apps.matteo,

According to your requests, it seems you want to enable Wishlist and disable Compare functionalities, if so please follow my latest replies.

Regards,

January 22, 2025 at 7:51 pm #631962

apps.matteo
Participant

Hi Hung,
maybe I explained myself badly or the translation doesn’t help.
Exactly the opposite.
I would like it to remain only “compare” but with the logo with the Heart see screenshot.
Thanks,
Matteo

January 23, 2025 at 10:02 am #632051

Hung Pham
Keymaster

Hi apps.matteo,

If so, please follow my above instructions https://xtemos.com/forums/topic/custom-icon-compare-wishlist/#post-631177

It will changes icon and keep text.

Regards,

January 23, 2025 at 11:54 am #632107

apps.matteo
Participant

Thanks for the reply Hung,
Great for the icon, but the text next to it still doesn’t change when you hold the mouse over it for (1)

2) the text next to the icon still appears

view screenshot please

Attachments:
You must be logged in to view attached files.

January 23, 2025 at 11:55 am #632109

apps.matteo
Participant

Anche questo screenshot

Attachments:
You must be logged in to view attached files.

January 25, 2025 at 2:07 pm #632698

apps.matteo
Participant

Good morning Hung, do you have any news or instructions or css to change the word “Compare”?
Thanks.
Matteo

January 27, 2025 at 4:49 pm #633159
Bogdan Donovan
Keymaster
Hi,

If you want the Compare icon to look like the Wishlist icon, please use the following custom code:
```
body .wd-compare-icon>a:before{
	content: "\f106";
}
```
If you want the text from the Compare option to look like the text from the Wishlist option, you need to install the Loco Translate plugin. Using this plugin, you can translate/rewrite all theme and plugin texts via PO file in WordPress. Here is a video tutorial that should help you translate your website texts with a Loco Translate plugin https://www.youtube.com/watch?v=D3NsDdMzsls&list=PLMw6W4rAaOgKKv0oexGHzpWBg1imvrval&index=3

Kind Regards
Author

Posts