woocommerce cart butons customize

Hi there ??

Please share a link to your site to see if I can generate a personalized custom CSS code for you.

Thanks!

Hello,

I need for the cart page the css class of the buttons: Apply cupon, Update cart, Proceed to checkout.
It is something like ..woocommerce … .button {
background-color: #FF0000;
color: #C0C0C0;
}

Without being able to see the HTML output of the site it’s difficult to offer any CSS to help change the color of the cart and checkout buttons.

To achieve this type of color change I’d recommend using Google Chrome Developer Tools. You can right-click anywhere on your webpage to select ‘Inspect Element’, the HTML and CSS properties show up right in your browser.

You can then write some custom CSS to change the section colors using the CSS classes related to that section you can see when using Chrome Developer tool

Cheers.

https://chub.ro/cart/

Thank you!

This can be fixed with some custom CSS. Under Customize > Additional CSS, you can add the following code:
?

.woocommerce-cart .woocommerce-cart-form button.button {
    background: #FF0000;
    color: #C0C0C0;
    border-color: #FF0000;
}

.woocommerce-cart a.checkout-button.button.alt.wc-forward {
    background: #FF0000;
    color: #C0C0C0;
    border-color: #FF0000;
}

Results:

https://www.screencast.com/t/MqNUIR3WW
?
If you’d like to learn more about CSS, I highly recommend using the free tutorials at w3schools. Here, you can find the basics of selectors (how to target the right element on the page), and properties (how to change the element on the page).

Cheers. ??

Hi @ovidiudruta,

We’ve not heard back from you in a while so I’ll go ahead and mark this thread as resolved. Hopefully, the above CSS code helped you out! If you have further questions, please feel free to open a new topic.

Thanks.