Return to previous page

Add to cart button appear on hover - by Kirill Klassen

This topic has 4 replies, 2 voices, and was last updated 5 years, 11 months ago ago by Rose Tyler

  • Avatar: Kirill_Klassen
    Kirill Klassen
    Participant
    June 26, 2019 at 14:06

    Hello,

    I was wondering if there’s a CSS to make add to cart button appear on hover in the shop grid rather than to have it on default? I’ve tried making my own grid with page builder but it’s too complicated

    thank you

    #216263 Copied Theme version: 5.3.1
    3 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    June 26, 2019 at 14:46

    Hello,

    You can change the “Product content effect” in Theme Options > Shop > Products style.
    Or try to use this custom CSS code:

    .content-product .product-details .button {
    opacity:0;
}
.content-product:hover .product-details .button {
     opacity:1;
}

    Regards

    #216267 Copied
    Avatar: Kirill_Klassen
    Kirill Klassen
    Participant
    June 27, 2019 at 09:53

    Thank you! CSS worked just like I wanted to!

    #216300 Copied
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    June 27, 2019 at 09:59

    You’re welcome!

    Regards

    #216302 Copied
  • Viewing 4 results - 1 through 4 (of 4 total)

The issue related to '‘Add to cart button appear on hover’' has been successfully resolved, and the topic is now closed for further responses

Recent Community Activity

Helpful Topics

Unleash your online potential

Explore our best WordPress WooCommerce Themes collection

lazy-placeholder
Lifestyle Blog – WordPress WooCommerce Theme
lazy-placeholder
Spa – WooCommerce Theme
lazy-placeholder
Coffee Store – WooCommerce Theme
lazy-placeholder
Furniture Store 02 – WordPress WooCommerce Theme
lazy-placeholder
Business – WordPress WooCommerce Theme
lazy-placeholder
Marketing – WordPress WooCommerce Theme
lazy-placeholder
Medical 02 – WordPress WooCommerce Theme
lazy-placeholder
Architecture – WordPress Theme
lazy-placeholder
Sneakers Store – WordPress WooCommerce Theme
lazy-placeholder
Corporate – WordPress Theme

See All Templates

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.