Woo commerce product page

  1. how can I change the background on the product page to be white. I see in x theme it is defaulted to grey.

  2. how can I change the font on the product page to be the one I choose for x theme options?

  3. How can I change the style of the button and button text on the product page?

  4. How can I delete the additional info on the product page

thanks

Hello Justin,

Thanks for writing in!

1.) To change the background on the product page to be white, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

body.single-product {
    background-color: white;
}

2.) To change the font on the product page to be the one I choose for x theme options, you will have to go to X > Them Options > Typography > Body & Content and make sure that there aren’t any custom css that changes the fonts of your contents.

3.) The buttons can be set in X > Theme Options > Buttons.

4.) The Additional info can be deleted in X > Theme Options > WooCommerce > Single Product and disable the Additional Tab.

We would loved to know if this has work for you. Thank you.

Everything worked except the font.

1.how would i make the billing page white also?
2. Is there a way to go straight from the product page to the billing page and skip the cart page? right now it has a pop up saying it has been added to cart. It would be bettter for my product to just automatically go to the billing page if that makes sense.

  1. also there is a shadow outlining the product and on the billing form, how can i delete that?

Thanks for helping me.

nevermind #2 i got it.

Instead of 2. can you tell me how to make the product image not able to zoom in?

Hello Justin,

  • To make the billing page also white, please use this code:
body.woocommerce-checkout {
    background-color: white;
}

And if ever you change your mind and would like to make the whole site have a white background, please go to X > Them Options > Layout & Design > Background Options. There should be a color picker there that you can use to change the background color.

  • And to removed the product image zoom, you will be needing to install a child theme. This allows you to make code changes that won’t be overwritten when an X update is released.

Once the child theme is set up, please add the following code in your child theme’s functions.php file

// Remove product gallery slider and gallery zoom
// =============================================================================
add_action( 'after_setup_theme', 'remove_woo_three_support', 11 ); 
function remove_woo_three_support() {
    remove_theme_support( 'wc-product-gallery-zoom' );
    remove_theme_support( 'wc-product-gallery-slider' );
}
// =============================================================================

Please review how we recommend making template changes in Customization Best Practices.

We would loved to know if this has work for you. Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.