"Color BG options for Woocommerce" (#1991716) / CodexThemes

Comments

OneDoorLand started the conversation
April 29, 2019 at 12:00am
Attached are images to help explain.
I need to customize some BG colors for woocommerce shop to match my dark style theme. Also want to change side menu background color. Also want to remove social icons from woocommerce. See attached images. Thanks

Woocommerce BG colors -

Side Menu background color -

Woocommerce Product - hide social icons -

4,774

Michael replied

April 29, 2019 at 10:04am

HI!

pls. use following css:

body .checkout-steps .checkout-step, 
body .checkout-steps .checkout-step:before, 
body .checkout-steps .checkout-step:after {
    background-color: #aaa;
}
.woocommerce .checkout .form-row .input-text, 
.woocommerce .edit-address-form .form-row .input-text, 
.woocommerce .checkout .form-row textarea.input-text, 
.woocommerce .edit-address-form .form-row textarea.input-text, 
.select2-search .select2-input, 
.woocommerce .checkout-login .login .form-row .input-text, 
.woocommerce .lost_reset_password .input-text, 
.woocommerce .my-account-signup .register .form-row .input-text {
    background-color: #aaa !important;
    border-color: #aaa !important;
}
.woocommerce-checkout-one-page .checkout-payment {
    background-color: #aaa !important;
}

2) pls. use following css:

.header-layout-fullwidth_hamburger #primary-menu.no-responsive {
    background: #aaa !important;
}

3) pls. use following css:

.single-product-content-left .socials-sharing.socials.socials-colored-hover {
    display: none;
}

OneDoorLand replied
May 4, 2019 at 3:22am
Thank you very much, that worked for most of the woocommerce edits. Here are a few more colors I need to find in options or with css.
Change color of background in white areas

Thanks

4,774

Michael replied

May 6, 2019 at 7:21am

HI!

pls. use following css:

.woocommerce .woocommerce-shipping-calculator .form-row input.input-text {
    background: transparent !important;
}
.woocommerce input[type="text"].coupon-code {
    background: transparent !important;
}
.woocommerce .cart_totals table th {
    background-color: transparent !important;
}
.woocommerce .shop_table tr.cart_item:nth-child(2n) td {
    background: transparent !important;
}
.checkout-order-review-pattern {
    display: none !important;
}

OneDoorLand replied
May 9, 2019 at 9:32pm
Perfect thank you! That worked great
4,774
Michael replied
May 10, 2019 at 10:21am
Welcome! Have a nice day!