Wrong variation image on zoom …

I’m having the exact same issue. A fix would be greatly appreciated!

Yep, i’ve been facing the issue too since last year.

Hi,
maybe it depends on the number of variation used, try appending the following code in functions.php located in your theme folder:

function custom_wc_ajax_variation_threshold( $qty, $product ) {
return 30;//change the value according to the max number of variations used
}
add_filter( ‘woocommerce_ajax_variation_threshold’, ‘custom_wc_ajax_variation_threshold’, 10, 2 );

I’ve tried the above, but has no effect.

This issue isn’t happening on all products with variations. I’ve only noticed it a few times.

A product I’ve just created has 40 variations, and only the featured image is shown on hover.

Another note – this has only recently started to happen. Never had this issue last year at all, and I’ve got some products with far more variations than 40.

Could it be since the major Woocommerce 3.0 update?

On further digging, I have now found that by drastically reducing the amount of variations things are almost back to normal.

Image variations are showing correctly on hover, but now when I hit “clear” next to the variation drop down – the main image isn’t returning to show the featured image, yet on hover this is showing the featured image.

I ‘ve encountered the same issue and i think i have figured out the cause.

When you have more than 30 variations WC changes the way it fetches them and uses an AJAX call.

30 is the default ‘setting’ so the code the author gave you above has no effect unless you change the number to something bigger than the number of variations your product has (as he suggests in the comment).

This plugin uses the woocommerce_available_variation filter in order modify the variation data and add the variation image so that the frontend code can get it.

That filter is hooked in yith-woocommerce-zoom-magnifier\class.yith-wcmg-frontend.php:48

And that code block is run in the template_redirect action hook which (probably) doesn’t run in an AJAX call.

Until they fix it you can use this to properly modify the data in order for it to work:

function wcmg_fix_ajax_filter_variations( $data, $wc_prod, $variation ) {

	$attachment_id = get_post_thumbnail_id ( version_compare ( WC ()->version, '3.0', '<' ) ? $variation->get_variation_id () : $variation->get_id () );
	$attachment    = wp_get_attachment_image_src ( $attachment_id, 'shop_magnifier' );
	
	$data['image_magnifier'] = $attachment ? current ( $attachment ) : '';
	
	return $data;
}
add_filter ( 'woocommerce_available_variation', 'wcmg_fix_ajax_filter_variations', 20, 3 );

(this ideally goes into your child theme’s functions.php)

• This reply was modified 7 years, 5 months ago by ksere.

Hi ,
I got the free theme shopisle and I have exactly the same problem.
Do you think that this problem will dissapear if I buy the pro version ?
How can you add code to the child theme fonction php ?

Cheers guys ??

Hi, if you want to correct this just change this

zoomImgFix = $(‘.yith_magnifier_zoom_wrap > a > img’).attr(‘src’);
self.zoomDiv = $(‘<div class=”yith_magnifier_zoom_magnifier” />’).css({
left: xPos,
top: yPos,
width: w,
height: h,
‘background-repeat’: ‘no-repeat’,
backgroundImage: ‘url(‘ + zoomImgFix + ‘)’
}).appendTo(appendTo);

to this one

self.zoomDiv = $(‘<div class=”yith_magnifier_zoom_magnifier” />’).css({
left: xPos,
top: yPos,
width: w,
height: h,
‘background-repeat’: ‘no-repeat’,
backgroundImage: ‘url(‘ + $(‘.yith_magnifier_zoom_wrap > a > img’).attr(‘src’) + ‘)’
}).appendTo(appendTo);

on the

plugins/yith-essential-kit-for-woocommerce-1/modules/yith-woocommerce-zoom-magnifier/assets/js

and also on

plugins/yith-essential-kit-for-woocommerce/modules/yith-woocommerce-zoom-magnifier/assets/js

• This reply was modified 6 years, 8 months ago by Rod.