Woocomerce Button Hover Colour

Activello
1

Hello!

Could you provide me with CSS to make all Woocommerce button hover colours white? Right now some are white and some are black.

Thank you,
Lucy

2

hi Lucy

Now your questions take customization character :slight_smile:
if there is 2 buttons like this then we can help but we can search for all buttons on the website and generate unique css codes for each button,
i need links to the pages where buttons are visible

3

Hi Noda

The Add to Basket button on this page has a black hover colour: https://www.theloveplace.co.uk/product-category/ebooks/

The Proceed to Checkout button on this page has a white hover colour: https://www.theloveplace.co.uk/basket/

The Place Order button on this page stays the same colour but the text has a white hover colour - I would like the button hover colour to be white and the text stay the same as usual: https://www.theloveplace.co.uk/checkout/

Thank you,
Lucy

4

Hello there,

I hope you are doing well today.

Please try out this CSS:


a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
    background-color: white;
    color: black;
}

Best Regards,
Support

5

Hi Noda

This changes the button colours and removes the hover colour - please see attached screenshot.

Thank you,
Lucy

6

Screenshots attached.

7

Please see the attached - the left shows the button as usual and the right shows it with the cursor hovering. I want all buttons to show like this when hovered over.

I also want to change the colour of the buttons once they have been pressed. Shop Add to Basket buttons turn black after they have been pressed. I would like to make them a different colour.

Thank you,
Lucy

8

Hello there,

You can change the color using the code provided before to another color that works for you.

This code should help you with the button after it is pressed:


a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart.added {
    background-color: red;
    color: black;
}

Best Regards,
Support

9

Hi Noda

Actually now when I try that code nothing happens at all…? No changes occur.

Thank you,
Lucy

10

Hello there,

I hope you are doing well today.

Please provide an image of all the CSS that you have added to the theme. There may be an error causing the CSS not to work.

Best Regards,
Support