We would like to provide CSS code for custom woocommerce button in wordpress

This code help you to custom color on button for your website

/* woo button ****/
.woocommerce #content input.button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page input.button.alt:hover {
background:#17252A !important;
background-color:#17252A!important;
color:white !important;
text-shadow: transparent !important;
box-shadow: none;
border-color:#17252A!important;

}
.woocommerce #content input.button:hover, .woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce-page #content input.button:hover, .woocommerce-page #respond input#submit:hover, .woocommerce-page a.button:hover, .woocommerce-page button.button:hover, .woocommerce-page input.button:hover {
background:#17252A!important;
background-color:#17252A!important;
color:white !important;
text-shadow: transparent !important;
box-shadow: none;
border-color:#17252A!important;

}
.woocommerce #content input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce-page #content input.button, .woocommerce-page #respond input#submit, .woocommerce-page a.button, .woocommerce-page button.button, .woocommerce-page input.button {
background: #17252A!important;
color:white !important;
text-shadow: transparent !important;
border-color:#17252A!important;

}
.woocommerce #content input.button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page input.button.alt:hover {
background: #17252A!important;
box-shadow: none;
text-shadow: transparent !important;
color:white !important;
border-color:#17252A!important;

}

 614 total views,  1 views today

Related Posts

  • Someone need to change about text on place order button for support requirement per your company, this solution will help you to fix it Go to backend admin page > Appearance > Theme File Editor > Function.php /**Woocommerce change text on place order buttton*/add_filter( 'woocommerce_order_button_text', 'custom_button_text' );function custom_button_text( $button_text )…
    Tags: woocommerce, website, knowledge, woocomerce, woo, wordpress
  • In this topic i would like to share code change select option button text on woocommrce Please go to file function.php, Apearace > Theme Editor add_filter( 'woocommerce_product_add_to_cart_text', 'cloudttrust_change_select_options_button_text', 9999, 2 );functioncloudttrust_change_select_options_button_text( $label, $product ) {if ( $product->is_type( 'variable' ) ) {return 'select option';}return $label;}
    Tags: woocommerce, woo, knowledge, website, woocomerce, wordpress
  • In this topic i would like to share code change currency symbol on woocommrce Please go to file function.php, Apearace > Theme Editor add_filter('woocommerce_currency_symbol', 'change_existing_currency_symbol', 10, 2);function change_existing_currency_symbol( $currency_symbol, $currency ) {switch( $currency ) {case 'USD': $currency_symbol = 'USD'; break;}return $currency_symbol;}
    Tags: woocommerce, woo, knowledge, website, woocomerce, wordpress
  • In this topic i would like to share code change add to cart button text on woocommrce Please go to file function.php, Apearace > Theme Editor // Change add to cart text on single product pageadd_filter( 'woocommerce_product_single_add_to_cart_text', 'woocommerce_add_to_cart_button_text_single' );function woocommerce_add_to_cart_button_text_single() {return __( 'add to cart', 'woocommerce' );}// Change add to…
    Tags: woocommerce, woo, knowledge, website, woocomerce, wordpress
  • So i think some theme of wordpress with plugin woocommerce that show relate products label on single product page wrong postion, We try to using CSS for adjust this label to correct position and it working Before use CSS code for adjust relate products label CSS Code.related.products {float: left!important;} After…
    Tags: woocommerce, wordpress, knowledge, website

Categories: