Wishlist and compare icons are half black with shadows on the catalogue page

This topic has 11 replies, 2 voices, and was last updated 2 hours, 50 minutes ago by Luke Nielsen.

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

Author

Posts
April 29, 2025 at 9:11 am #657186

hey3212
Participant

Hi,

On the home page, I have a Best Sellers section. The catalogue has 4 icons when hovering. Instead of showing all white, the wishlist and compare icons show half black with shadows on my page. Could you help?

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

April 29, 2025 at 10:23 am #657202

Luke Nielsen
Keymaster

Hello,

Remove the CSS from this https://prnt.sc/NnvZxjKrgd8V plugin, clear the cache and recheck the issue.

Kind Regards

April 29, 2025 at 12:05 pm #657250

hey3212
Participant

How to remove the css? Do I need to click on the CSS Editor link?

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

April 29, 2025 at 12:11 pm #657254

Luke Nielsen
Keymaster

Yep, click on CSS Editor and you will see custom CSS code. Hide that code, clear the cache and check how it works.

Kind Regards

April 29, 2025 at 12:17 pm #657256

hey3212
Participant

Ok. I see an entire page of codes. Do you mean I need to remove everything in that window?

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

April 29, 2025 at 12:25 pm #657261

Luke Nielsen
Keymaster

Hide this code – https://prnt.sc/raAKxbNH0sTs and everything that is related to the wishlist, compare buttons.

Kind Regards

April 29, 2025 at 12:31 pm #657265

hey3212
Participant

Hi,

I believe my developer wrote those codes to give me the effect of backgrounds and styles of the compare and wishlist icons on the single product page. see attached. But it turned out that his codes interfere with the product grid icons. If I want to keep those codes, could you suggest how to apply them to only the product page displays?

He has for the moment temporarily fix the grid icon display and they are back to normal now. Just need to know how to apply these codes just to the product page and not the grid.

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

April 29, 2025 at 12:39 pm #657269

Luke Nielsen
Keymaster

Add the .single-product class before that https://prnt.sc/szWnyQY3vCS2 code, ite should be via the space , e.g. .single-product .wd-btn...

Kind Regards

April 29, 2025 at 12:39 pm #657270

hey3212
Participant

My other developer has only added these codes to normalize the grid display, but after this, the product page icon display has gone too https://prnt.sc/lUJKQ9SKbHin

April 29, 2025 at 1:00 pm #657284

hey3212
Participant

The icons would need to appear something like the attached on the single product page. The wishlist icon should have blue background matching the button in front of it.

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

April 29, 2025 at 2:40 pm #657303

hey3212
Participant

Regarding to what you said about “Add the .single-product class before that https://prnt.sc/szWnyQY3vCS2 code, ite should be via the space , e.g. .single-product .wd-btn…”, should I keep the codes here https://prnt.sc/lUJKQ9SKbHin ?

April 29, 2025 at 4:55 pm #657344

Luke Nielsen
Keymaster

Hello,

You can do it here – https://prnt.sc/raAKxbNH0sTs , this one https://prnt.sc/sKeJN0pBKUQT you can remove, as I understand this https://prnt.sc/sKeJN0pBKUQT code is for the grid of products. We have default styles for the buttons on the grid so this code is not needed https://prnt.sc/lUJKQ9SKbHin .

When you modify this https://prnt.sc/szWnyQY3vCS2 code, it should not affect the buttons on the grid thus, this code https://prnt.sc/lUJKQ9SKbHin is not needed.

Let me know the result.

Kind Regards
Author

Posts