Woocommerce JQuery replace main product image with thumbnails

2 Views

so I have been at it to implement the “main product image exchange” since this morning and I am just not getting there. After changing the complete design of my website I wanted to re-do the tweak but it is simply not working.

In the past I had used this code:

Read More
jQuery(document).on('click','.thumbnails .zoom', function(){
    var photo_fullsize =  jQuery(this).find('img').attr('src').replace('-58x58','');
    jQuery('.woocommerce_main_image img').attr('src', + photo_fullsize + );
    return false;
});

Src: Replace main image with thumbnail on click with jQuery

I had added this to my functions.php: 

add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
    wp_enqueue_script(
        'productgallery', // name your script so that you can attach other scripts and de-register, etc.
        get_template_directory_uri() . '/js/productgallery.js', // this is the location of your script file
        array('jquery') // this array lists the scripts upon which your script depends
    );
}

My problem now is, that the thumbnails take me directly to the images. No exchange no nothing. I was playing around with the classes and all since I thought maybe woocommerce changed them over the course of updates…

Some more input for classes – Main Product Image & Thumbnails: 

<div class="product_image">
<a class="woocommerce-main-image zoom" data-rel="lightbox[product-gallery]"    title="1422571149-171" itemprop="image" href="MY WEBSITE/... .jpg">
<img class="attachment-shop_single wp-post-image" width="456" height="456" title="1422571149-171" src="MY WEBSITE/... .jpg-456x456.jpg">
</a>

</div>
<div class="product_thumbnails">
<a class="zoom first" data-rel="lightbox[product-gallery]" title="1422571167-808" href="MY WEBSITE/... .jpg">
<img class="attachment-shop_thumbnail" width="58" height="58" alt="1422571167-808" src="MY WEBSITE/...-58x58.jpg">
</a>

Thank you heaps for a solution here!

taobao

Post Views: 2

Related posts