Zoom on woocommerce product pages

Support
#1

Hi There - since updating woocommerce there is now a zoom on the images and they are much smaller than they were before.
I resized in the settings and regenerated images but it made no difference.
I also added the following to the child functions file but it made no difference.

// 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 could you advise what I should do to get the zoom off and get my images back to normal.

Many thanks.

Product gallery zoom on hover
#2

Hello,

To fix this, add the following code to your functions.php

// Disable the gallery zoom on single products
// =============================================================================
add_action( 'after_setup_theme', 'removing_gallery_zoom', 100 );

function removing_gallery_zoom() { 
remove_theme_support( 'wc-product-gallery-zoom' );
}
// =============================================================================

P.S: This code was tested on my localhost and it works and the difference is the parameter 100 instead 11. Clear your cache after add this code.

1 Like
#3

Hi There

Sorry that did not work - cleared cach after

kind regards

#4

Hi There,

Would you mind providing us with login credentials(by clicking on the Secure Note button at the bottom) so we can take a closer look? To do this, you can make a post with the following info:

  • Link to your site
  • WordPress Admin username / password
  • FTP credentials

Thanks.

#5

No Problem Thai

If you look at the size of the main product image it should be the larger size which is shown when you zoom. Instead I am just getting a small image.#

Thanks.

#6

Hi,

You can change the image size under woocommerce settings.

Make sure to regenerate your thumbnails after changing the size.

Then add this in Custom CSS

.single-product .woocommerce-product-gallery__image > a > img {
    width:100%;
}

With regards to removing the zoom effect, I tried the code in my test site and it seems to work.

I can see in that you have many functions backup file, can try removing them or add them in a folder.

Thanks

#7

Thank you that has worked well. Much appreciated.

Kind regards

#8

You are welcome!