WooCommerce 3.0 New Product Gallery Not Working?

The new product gallery in WooCommerce 3.0 is excellent, the thumbnails now react the way that they should and there is a great Zoom feature, I love it.

However you could well find that you have run your WooCommerce update and your galleries do nothing, even worse you have a jpg file opening when you click a thumbnail.  In this case you will need to make sure your theme supports the new WooCommerce features.

The new gallery uses Flexslider, Photoswipe, and the jQuery Zoom plugin to offer swiping, light boxes and other fab features. This new gallery is off by default for custom and 3rd party themes and to enable it you will need to declare theme support by adding the code below to the WooCommerce theme support declaration in your theme functions file.  (You might prefer to ask a developer to do this one for you).

add_theme_support( 'wc-product-gallery-zoom' );
add_theme_support( 'wc-product-gallery-lightbox' );
add_theme_support( 'wc-product-gallery-slider' );

You do not have to support all 3 items; you can pick and choose. If a feature is not supported, the scripts will not be loaded and the gallery code will not execute on product pages.

(Source GitHub »)

I added a bit of space around my thumbnail images but I think the gallery looks great straight out of the box.

woocommerce product gallery


Share on FacebookTweet about this on TwitterPin on PinterestShare on LinkedInShare on Google+Email this to someone

© Tracey Rickard. If you want to use any of my content please ask me first, you can't use it without permission that's stealing. You can use an excerpt as long as it is linked back to this article.