[Support request] Woocommerce add to cart button visited

[Bart]

Sofar I couldn’t find a way to customize the add to cart buttons after clicking and succesfully dropping a product into the cart. I suppose it is a CSS style for .woocommerce a:visited… any advise?

[David]

Hi there,

it’s possible for the shop archive pages, as the added class is append to the a tag – so try this CSS:

.woocommerce a.button.added, .woocommerce a.button.added:hover {
    /* Your CSS styles here */
}

[Bart]

David, I added in Simple CSS:

.woocommerce a.button.added {
background-color: red !important;
}

But no effect on the bk colour of the add-to-cart button after adding the product to the cart. any other possibilities I could try?

[David]

Could you provide a link to the site so i can take a look?
You can edit your original topic and use the Site URL field to share a link privately.

[Bart]

https://vruchtbareaarde.nl/webwinkel/

[David]

Where did you add the CSS?

[Bart]

You are right … In the meantime I tried other things … But now the CSS class is back again in Simple CSS:
.woocommerce a.button.added {
background-color: red !important;
}

[David]

Looks like its working to me, tested on archive pages the button background color changes on add to cart.

[Bart]

What I see as confirmation of an order, is this:

• In the destop-version of the site the red bk-button-colour appears and also the checkmark (✔)
• When I open the same screen in the customizer: the red colour and the checkmark (✔) are there for only a second … to disappear almost immediately
• On a smartphone screen there is no red colour. Instead I’ll get a yellow colour (default?) with a checkmark
• On a single-product-page, after confirmation, there is no change at all: no difference in colour and no checkmark (✔). It would be nice to see the same bk-button-colour-change on a product-page as on a category-page

[David]

I have edited the CSS here – which will fix the issue on Mobile.

The way the Customizer works it may not be possible to reflect these changes. The main thing is it works on the front end.

This will only work on the shop / archive pages – Woo doesn’t add a class to the buttons on the single product so it’s not possible to style it this way.

[Author]

Posts