Ensure you have the latest version of your theme. If so, consider asking the theme vendor to resolve the problem.
If you don’t get a resolution, try this in your custom css:
button.single_add_to_cart_button.button.alt {background:#ff0000}
.woocommerce #content input.button.alt {background:#ff0000}
.woocommerce-page #content input.button.alt {background:#ff0000}
Adjust the hex value to a colour of your choice.
Thanks a lot, Iorro. It is very helpful.
I managaed to change the “Cart” page “Proceed to Checkout” button, and also the checkout page.
However, for the product page (as in my previous URL), I cannot find it in “Pages”. Do I need to edit in the “Plugin”->”Editor”? If so, where is that page to edit?
Also, while I can change the color of the button, the “mouse-over” is still white. Is it possible to change the mouse-over as well?
The product page is the shop page that renders differently according to the current query string parameters. There is no need to edit the page, the trick is to get the css right.
Try making the first line of my above suggestion more specific by changing it to:
.woocommerce button.single_add_to_cart_button.button.alt
{background:#0000ff}
.woocommerce-page button.single_add_to_cart_button.button.alt
{background:#0000ff}
For the mouse over color, duplicate all the new css lines, but with added :hover, and a different colour, eg
.woocommerce button.single_add_to_cart_button.button.alt:hover
{background:#00ff00}
Thanks again, lorro. I finally realized where to put those styles overrides. You’re very helpful and skillful indeed.
