Woocommerce global button style

by | Sep 21, 2026 | Snippets, Woocommerce

Skip to main content
How Can We Help?
< All Topics
Print

Woocommerce global button style

Posted
Updated
Byattractiveuidesign 

/*Woocommerce global button style start*/
body #page-container #et-boc #et-main-area .single_add_to_cart_button,
body #page-container #et-boc #et-main-area .add_to_cart_button,
body #page-container #et-boc #et-main-area .et_pb_wc_related_products li .button,
body.woocommerce #page-container #et-boc #et-main-area ul.products li.product .button,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area a.button,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area button.button,
body.woocommerce-page #page-container #et-boc #et-main-area button.button{
  background-color: #057dcd !important;
  color: #ffffff !important;
  font-size: 16px !important;
  letter-spacing: 0px !important;
  padding-top: 10px !important;
  padding-right: 25px !important;
  padding-bottom: 10px !important;
  padding-left: 25px !important;
  border-radius: 8px;
  border: none !important;
}
body.woocommerce-page #page-container #et-boc #et-main-area a.checkout-button{
	padding: 1em;
}
body #page-container #et-boc #et-main-area .single_add_to_cart_button:hover,
body #page-container #et-boc #et-main-area .add_to_cart_button:hover,
body #page-container #et-boc #et-main-area .et_pb_wc_related_products li .button:hover,
body.woocommerce #page-container #et-boc #et-main-area ul.products li.product .button:hover,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area a.button:hover,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area button.button:hover,
body.woocommerce-page #page-container #et-boc #et-main-area button.button:hover{
  background-color: #ffce75 !important;
  color: #1f3d58 !important;
}

body #page-container #et-boc #et-main-area .single_add_to_cart_button:after,
body #page-container #et-boc #et-main-area .add_to_cart_button:after,
body #page-container #et-boc #et-main-area .et_pb_wc_related_products li .button:after,
body.woocommerce ul.products li.product .button:after,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area a.button:after,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area button.button:after {
  display: none;
}

body.woocommerce-account.et_pb_button_helper_class #page-container #et-boc #et-main-area  a.button{
  background-color: #FFCE75 !important;
  padding: 12px 30px !important;   
  color: #162535 !important;
  border: none !important;
  
}
body.woocommerce-account.et_pb_button_helper_class #page-container #et-boc #et-main-area  a.button:hover{
  background: #162535 !important;
  color: #fff !important;
}
body.woocommerce-account #page-container #et-boc #et-main-area  a.button:after{
  display: none !important;
}

body.woocommerce #page-container #et-boc #et-main-area #respond input#submit,
body.woocommerce-page #page-container #et-boc #et-main-area #respond input#submit,
body.woocommerce #content input.button,
body.woocommerce-page #page-container #et-boc #et-main-area #content input.button,
body #page-container #et-boc #et-main-area .woocommerce-message,
body #page-container #et-boc #et-main-area .woocommerce-error,
body #page-container #et-boc #et-main-area .woocommerce-info {
  background: #057dcd !important;
  font-size: 15px !important;
}

/*Woocommerce global button style end*/
Table of Contents