Reply To: Product variation image is not being displayed woocommerce

forums forums Circle Flip Support Product variation image is not being displayed woocommerce Reply To: Product variation image is not being displayed woocommerce


a.rady
Keymaster
#1750

Hello Andrei,

I just committed a fix for this issue into our codebase, which will be available in the next update ( 24-48 hours ).

but you don’t need to wait you can apply the changes on your own, here is the code:

1- file THEME DIRECTORY/woocommerce/single-product/product-image.php
change line #15 from <div class="postImage"> To <div class="postImage images">

2- file THEME DIRECTORY/js/site.js, add this code at line #446
/**
* make Product variation images work in single product views
*/
if ( 'object' === typeof $variation_form ) {
var $productImageContainer = $( '.postImage' );
$variation_form
.on( 'found_variation', function( event, variation ) {
if ( ! variation.image_link ) {
return;
}
$productImageContainer.trigger( 'zoom.destroy' ).zoom( {
url: variation.image_link
} );
} )
.on( 'reset_image', function( event ) {
$productImageContainer.trigger( 'zoom.destroy' ).zoom( {
url: $productImageContainer.find( 'div[data-full]' ).data( 'full' )
} );
} );
}

3- file THEME DIRECTORY/functions.php, add this code at the end of the file
/** add 'wc-add-to-cart-variation' script as a dependency for 'circleflip-site'.
*
* ensures that $variation_form variable is defined before site.js is called.
*
* @global WP_Scripts $wp_scripts
*/
function circleflip_add_woocommerce_script_dependency( $template_name ) {
global $wp_scripts;
if ( ! function_exists( 'is_product' ) || ! is_product() || 'single-product/add-to-cart/variable.php' !== $template_name ) {
return;
}
$circleflip_site_script = $wp_scripts->query( 'circleflip-site' );
if ( $circleflip_site_script instanceof _WP_Dependency && $wp_scripts->query( 'wc-add-to-cart-variation' ) ) {
$circleflip_site_script->deps[] = 'wc-add-to-cart-variation';
}
}
add_action( 'woocommerce_before_template_part', 'circleflip_add_woocommerce_script_dependency', 10, 2 );

Regards