greencode on "[Plugin: WooCommerce] Replace Product Image with Thumbnail on Click"

ساخت وبلاگ

greencode
Member
Posted 16 hours ago #

I've had this script on one of my sites for a while now but at some point something's has broken. Not sure what or when. Basically I had this to replace the main product image (on a single product page) with the thumbnail, when clicked.

<script type="text/javascript"> jQuery('.thumbnails .zoom').click(function(){ var photo_fullsize = jQuery(this).find('img').attr('src').replace('-180x180','-600x600'); jQuery('.woocommerce-main-image img').attr('src', photo_fullsize); retu false; });
</script>

I've checked the images sizes are correct i.e. 180x180 for a thumbnail and 600x600 for the main image and they are so I'm a little lost!

Any ideas or help to get it working again would be greatly appreciated.

https://wordpress.org/plugins/woocommerce/

Would need to see the page to check classnames.

Ah I think I know what it may be. WordPress 4.4 introduced srcset for responsive images. Your code does not swap these out, just the main src.

greencode
Member
Posted 31 minutes ago #

Any ideas how I would go about tweaking the code so that it works?

You should swap the src and srcset from the main image to the clicked image, rather than replacing just part of the src string. I don't have code snippet handy.

greencode
Member
Posted 15 minutes ago #

Ah ha. I think I've done it.

Just replaced "src" with "srcset" in the above code and all appears to be working as it should.

Thanks for the guidance.

WordPress ...
ما را در سایت WordPress دنبال می کنید

برچسب : نویسنده : استخدام کار wpss بازدید : 222 تاريخ : پنجشنبه 30 ارديبهشت 1395 ساعت: 18:10