Woocommerce Issues with single product pages

[Web_Services]

Hi my site is newsite.storeitcold.com.

I wanted to fix a few things on Woocommerce product pages (e.g this one – https://www.newsite.storeitcold.com/product/coolbot-pro/) :

1. How can we get rid of the “Additional Information” tab?
2. How can we get rid of image magnification on products when we hover over them?
3. Is it possible to put in a tab for submitting questions?

Thanks!

[nabeel]

Hi @Web_Services,

Thank you for reaching out to us.

• To get rid of “Additional Information” tab simply add the following code in the Theme Options > CSS:

.additional_information_tab {
    display: none;
}
.x-nav-tabs {
    display: flex;
}
.x-nav-tabs>li {
    width: auto;
    flex: 1;
}

• To get rid of image magnification on products page, you can use the following code:

.woocommerce div.product .images {
    pointer-events: none;
}

• To add custom Tabs, you can take a look at the following plugin here or this thread here https://stackoverflow.com/questions/39037326/how-to-create-a-new-woocommerce-product-tab but please note that we cannot provide support for third party plugins or scripts as our support policy in the sidebar states due to the fact that there is simply no way to account for all of the potential variables at play when using another developer’s plugin or script.

Thanks for understanding. Take care!

[Web_Services]

Regarding point 2:

I put in the code to disable magnification. And while it worked, it also look away the ability to scroll through the images. How can we disable the zoom effect while retaining the ability to scroll?

[christian]

Hey @Web_Services,

I just first like to comment on point 1. You don’t need CSS for that and it’s not recommended. Please remove the custom CSS and disable the Additional Information Tab in Theme Options > WooCommerce > Single Product.

Regarding point 2, please remove the CSS too. The correct way to disable the zoom is removing the zoom feature of WooCommerce. You can do that by installing a child theme and adding the following code in your child theme’s functions.php file.

add_action( 'after_setup_theme', 'disable_wc_new_features', 99 );
 
function disable_wc_new_features() {
  remove_theme_support( 'wc-product-gallery-zoom' );
}

Hope that helps.

[Web_Services]

Hi thank you! Just one more thing: getting rid of zoom leads to a lightbox when the image is clicked. How can we disable the lightbox too?

[ruenel]

Hello @Web_Services,

To get rid both the zoom and the lightbox, simply update the php code given by @christian_y and then use this:

add_action( 'after_setup_theme', 'disable_wc_new_features', 99 );
 
function disable_wc_new_features() {
  remove_theme_support( 'wc-product-gallery-zoom' );
  remove_theme_support( 'wc-product-gallery-lightbox' );
} 

We would love to know if this has worked for you. Thank you.