Clickable WooCommerce Variation Thumbnails

21 March 2017 #Code

Just wrote this code which totally worked beyond my imagination before realising I no longer needed to use Variations on this particular WooCommerce site. So, might as well share it.

Insert this into your-theme/woocommerce/single-product/product-image.php

This will¬†output each variation’s thumbnail and name. With some jQuery to update the variation drop-down to match the thumbnail you click.

Now you’ll need to change some of the variables in there.¬†Change select[name="attribute_colour"] to match the variation drop-down you’re targeting.

I probably could’ve improved this to popular the drop-down name automatically…

View on PasteBin