[Resolved] WoocCommerce buttons on Cart Page and Checkout Page

[Walter]

I use WooCommerce in combination with GeneratePress Premium and Elementor (I have also the plugin StoreCustomizer).

What happens is that the buttons on the WooCommerce pages Cart and Checkout are square.
However, I want to have a radius of 5 on all buttons on these pages (in reality on all buttons through the website by default but non WooCommerce pages I can easily adapt with Elementor).

The colors of the buttons and text and the Hoover color and text are all fine and can be set in the customizer. The only thing I cannot figure out is where I can change the radius setting for buttons on these WooCommerce pages.

[Leo]

Hi there,

WooCommerce buttons are a pain to deal with and should be handled by their support team.

If you can link me to the page in question, I can try to help with some CSS.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Walter]

Hi Leo, Yes, it are just pages with a woocommerce shortcode on it and what you see depends on wether you are logged-in or not (for example the my-account page shows a login/register screen when not logged in, and a dashboard when logged in). But the buttons on these WooCommerce pages are all “square”

https://www.lifeschool10.nl/my-account
https://www.lifeschool10.nl/cart
https://www.lifeschool10.nl/checkout

Walter.

[Walter]

p.s. Leo, if you create an account and then go to https://www.lifeschool10.nl/shop you could add a product to the cart (there is only one, the site is not life so no worries) and then you can see more on the cart en especially the checkout page.

[Leo]

Can you give this CSS a shot first?

.woocommerce button.button {
    border-radius: 5px;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Walter]

Leo, very close

My-Account page : Login and Register buttons are fine (also when going into lost password, the button is fine).

Checkout page : Place Order button is fine.

Cart page : Apply Coupon button is fine …… only the “proceed to checkout” button is still without radius.

[Leo]

I’m not seeing a proceed to checkout button on the cart page unfortunately.

Where can I add a product?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Walter]

Leo, thanks, indeed you only see that when you place an order first, so to have at least one item in the Cart. There is no need to do that anymore as (with your help) I have figured out what to do. I have changed your provided line of CSS into the below one and that works fine on the shortcode/dynamic WooCommerce pages.

.woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
border-radius: 5px;
}

Thanks again and I will mark the ticket as resolved.

[Leo]

Glad to hear L(

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts