Icons on hover (mobile), swap add to wishlist button for the compare button

Hi,
If using the icons on hover design for products, is it possible to switch the wishlist button for the compare button when viewing on mobile? So cart and compare would shown and not cart and wishlist.

Regards,
Paul

Hello,

If you want to display the compare icon on mobile and want to hide the wishlist icon on hover when you are in the mobile screens. And cart icon is already in the header.

You can use the below CSS code in Theme Settings >> Custom CSS >> Global Custom CSS:

.product-grid-item .woodmart-buttons .product-compare-button {
display: block ;
}

And to hide the wishlist from the mobile devices use the below CSS code in Theme Settings >> Custom CSS >> Custom CSS for mobile:

.product-grid-item .woodmart-buttons .wd-wishlist-btn{
display: none;
}

Best Regards.

Fantastic, thank you 😉

Hello,

I’m so happy to hear you are pleased with the Theme and Support. XTemos strives to deliver the best customer experience, and it makes our day to hear we have accomplished that.

We count ourselves lucky to have you as a customer.

Thanks for contacting us.
Have a great day.

Topic Closed.
Best Regards.

[Author]

Posts