How to change “Selection Options” to Add to Cart- WordPress & Woo-commerce

Code snippets

Copy this code and paste it in to additional css on your wordpress theme

 
[dm_code_snippet background=”yes” background-mobile=”yes” slim=”no” line-numbers=”no” bg-color=”#abb8c3″ theme=”light” language=”css” wrapped=”no” height=”500px” copy-text=”Get the Code!” copy-confirmed=”You have it!”] body {     font-family: “Helvetica Neue”,Helvetica,Arial,sans-serif;     font-size: 14px;     line-height: 1.42857143;    color: #ffffff;     background-color: #000; } .page .content-page a:not(.elementor-button) {     text-decoration: initial;       text-decoration-color: initial; } h1, h2, h3, h4, h5, h6 {     color: white; } .wc-block-grid__product-title {     font-family: inherit;     line-height: 1.2em;     font-weight: 1000;     color: inherit;     font-size: 15px;     text-align: left; text-decoration: none; } .wc-block-grid__product-price {  display: block;     font-size: 14px;     text-align: left; } .wc-block-grid__product .wc-block-grid__product-image, .wc-block-grid__product .wc-block-grid__product-title {     margin: 0 0 0px; } .wc-block-grid__product-add-to-cart.wp-block-button {      display: table-cell;     font-size: 14px } .wp-block-button__link {     color: #fff;     background-color: #a018cc;     cursor: pointer;     font-size: 15px;     padding: .667em 1.333em;     text-align: center;     overflow-wrap: break-word; } .woocommerce div.product p.price, .woocommerce div.product span.price {     color: #e0e0e0;     font-size: 16px;     font-weight: 700; } .woocommerce ul.products li.product .button, .woocommerce .widget_price_filter .price_slider_amount .button, .single_add_to_cart_button, .woocommerce a.button, .woocommerce button.button {     color: #fff !important;     background: purple!important; } .panel {     margin-bottom: 20px;     background-color: #000000;     border: 1px solid transparent;     border-radius: 4px;     -webkit-box-shadow: 0 1px 1px rgb(0 0 0 / 5%);     box-shadow: 0 1px 1px rgb(0 0 0 / 5%); } .woocommerce div.product .woocommerce-tabs ul.tabs li.active {     background: #000000;     transition: .4s; } [/dm_code_snippet]
[dm_code_snippet background=”yes” background-mobile=”yes” slim=”no” line-numbers=”no” bg-color=”#abb8c3″ theme=”light” language=”php” wrapped=”no” height=”500px” copy-text=”Get the Code!” copy-confirmed=”You have it!”] add_filter( ‘woocommerce_product_add_to_cart_text’ , ‘custom_woocommerce_product_add_to_cart_text’ ); function custom_woocommerce_product_add_to_cart_text() { global $product; $product_type = $product->product_type; switch ( $product_type ) { case ‘variable’: return __( ‘Add to Cart’, ‘woocommerce’ ); break; } } [/dm_code_snippet]

White Background CSS

body {

font-family: “Helvetica Neue”,Helvetica,Arial,sans-serif;

font-size: 14px;

line-height: 1.42857143;

color: #ffffff;

background-color: white;

}

.page .content-page a:not(.elementor-button) {

text-decoration: initial;

text-decoration-color: initial;

}

h1, h2, h3, h4, h5, h6 {

color: white;

}

.wc-block-grid__product-title {

font-family: inherit;

line-height: 1.2em;

font-weight: 1000;

color: inherit;

font-size: 15px;

text-align: left;

text-decoration: none;

}

.wc-block-grid__product-price {

display: block;

font-size: 14px;

text-align: left;

}

.wc-block-grid__product .wc-block-grid__product-image, .wc-block-grid__product .wc-block-grid__product-title {

margin: 0 0 0px;

}

.wc-block-grid__product-add-to-cart.wp-block-button {

display: table-cell;

font-size: 14px

}

.wp-block-button__link {

color: #fff;

background-color: #a018cc;

cursor: pointer;

font-size: 15px;

padding: .667em 1.333em;

text-align: center;

overflow-wrap: break-word;

}

.woocommerce div.product p.price, .woocommerce div.product span.price {

color: #e0e0e0;

font-size: 16px;

font-weight: 700;

}

.woocommerce ul.products li.product .button, .woocommerce .widget_price_filter .price_slider_amount .button, .single_add_to_cart_button, .woocommerce a.button, .woocommerce button.button {

color: #fff !important;

background: purple!important;

}

.panel {

margin-bottom: 20px;

background-color: #000000;

border: 1px solid transparent;

border-radius: 4px;

-webkit-box-shadow: 0 1px 1px rgb(0 0 0 / 5%);

box-shadow: 0 1px 1px rgb(0 0 0 / 5%);

}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {

background: #000000;

transition: .4s;

}

Loading

Share the Post:
You were not leaving your cart just like that, right?

You were not leaving your cart just like that, right?

Enter your details below to save your shopping cart for later. And, who knows, maybe we will even send you a sweet discount code :)

Unlock Your Free Beats

Sign up to get free beats download