Removing hover add to cart button

Hey @stefanbrattinga,

Thanks for reaching out!

It looks like you want to remove the “Add to cart” button that appears when hovering on a product, correct?

Would you mind sharing your site URL, as well as a copy of your sites System Status Report so that we can take a closer look?

You can find this via WooCommerce?→?Status. Select?Get system report?and then?Download for Support.

This will download a TXT file that has the contents of the SSR which you can then share with us here.

Cheers!

Hi!

Yes, correct.
The domain is: https://www.promowise.eu/
And here the SSR: https://we.tl/t-hLdKhqW7G9

Hi @stefanbrattinga,

Thanks for providing the detailed system status report and your site URL. It’s really helpful for understanding your environment.

Looking at your system report, I see that you’re currently using WooCommerce version 8.1.0. The latest available version is 8.3.1, so you might want to consider updating to the latest version to ensure you have all the recent features and fixes. Also, your Astra theme has an update available to version 4.5.1 which might include improvements and bug fixes.

?? Just a quick reminder: Before you make any changes, we strongly recommend that you create a backup of your full site and database. This is a crucial step to ensure that in case anything goes wrong, you can easily restore your site to its previous, functioning state.

As for the “Add to Cart” button issue, this can be resolved by adding a custom CSS to your theme. Here is the CSS you can use:

.ast-on-card-button.ast-select-options-trigger.product_type_simple.add_to_cart_button.ajax_add_to_cart {
  display: none;
}

Here’s an image for your reference:

Image Link: https://s5.gifyu.com/images/Si9Xf.gif

Here’s how you can add this CSS to your website:

1. Open your WordPress dashboard.
2. Navigate to Appearance -> Customize -> Additional CSS.
3. Copy and paste the CSS provided into the Additional CSS box.
4. Hit the “Publish” button to save your changes.

This CSS code will hide the “Add to Cart” button that appears when hovering over a product on your shop page.

?? Please note that this CSS is specific to the Astra theme you’re using. If you change your theme, you might need to use a different CSS code to achieve the same effect.

Give this a shot and let me know if it solves the issue. If you’re still having trouble, don’t hesitate to reach out. I’m here to help!

Hi,

Thanks a lot. I’m going to test this tomorrow and let you know.

Hi @stefanbrattinga

Sounds like a plan! Please update that how your testing goes!

Cheers!

Works perfectly!

Thanks!

Hey @stefanbrattinga,

That’s great to hear!

I’ll go ahead and mark this as resolved then – feel free to?create a new topic?if you need any further help.

Also, if you have a minute, we’d love it if you could leave us a review:

https://www.ads-software.com/support/plugin/woocommerce/reviews/

Cheers!

Hello,
I also have the same issue.
I tried to remove the icon add to cart button when hovering over a product.

Tried to copy paste the code

.ast-on-card-button.ast-select-options-trigger.product_type_simple.add_to_cart_button.ajax_add_to_cart { display: none; }

but not working for me unfortunately or maybe I’m doing wrong thing.

Here is the link : https://bikeone-motorstore.be/product-category/motos/

could you help me please ?

Thanks a lot

• This reply was modified 1 year, 1 month ago by adilr.

Hi @adilr,

Please add this custom CSS to your site at Appearance → Customize → Additional CSS:

.astra-shop-thumbnail-wrap:hover .ast-on-card-button:not(.ast-onsale-card) {
  display: none !important;
}

To see the changes, please ensure you clear your browser cache after adding the CSS.

If this makes no difference, it would be best to reach out to the theme’s developers for further assistance.

Since this is a third-party theme which we don’t provide support for (please see our Support Policy). I am sure they will have no problem supporting you there.

Thanks!

Hello,

thanks for the updated CSS. I have a similar issue, but in my case, I just want to remove ‘add to cart’ but would like to keep ‘show’ button while howering (both bottoms now appear).

It seems weird that I can add/remove the ‘show’ button from Astra but cannot remove the add to cart button explicitely.

Thanks in advance for your help,

Jay

Hi @jay2022,

It might be due to the specific configuration of your theme. Could you share your website URL and screenshots showing the issue on your end? For screenshots, you may use https://snipboard.io. Please follow the instructions on that page and then paste the URL into this thread.

However, as we mentioned earlier, we don’t provide support for third-party themes and plugins (please see our Support Policy). It would be best to contact the theme’s developers for further assistance.

I hope this provides some clarity. Thanks!