How to add a link on product grid
-
Hi,
How to add a link to the single product page on product grid on hover when I chose ‘Show button on hover on image’?
Attachments:
You must be
logged in to view attached files.
Hello,
Unfortunately, there is currently no way to change the link of the “add to cart” button on the Shop page.
Please hold patience with us. Thanks for your time and have a great day.
Kind Regards
Thx for your reply. I donĀ“t want to change the ‘ad to cart’ link. I want to add an additional link for the grey hover field. See picture attached….
Otherwise the user has to click on the product description text bellow to switch to the single product page, which seems to be bad for the user experience.
Hello,
Okay, no problem. The below code will be able to refer to the single product page by clicking on the hover gray area. Enter the code to the “Custom CSS for desktop” area that is in Theme Settings -> Custom CSS.
.wd-hover-button .product-image-link {
position: relative;
z-index: 3;
}
.wd-hover-button .product-image-link:before {
content: "";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 4;
background-color: rgba(0,0,0,0.5);
opacity: 0;
transition: opacity .3s ease;
}
.wd-hover-button:hover .product-image-link:before {
opacity: 1;
}
.wd-hover-button .wd-add-btn {
z-index: 5;
}
Don’t hesitate to let me know if you need any further help or any other info.
Kind Regards