Product grid is broken on the Colelction pages. How to fix that?

We've noticed a minor mis-alignment in some stores, especially using Google Chrome, where the product grid is misaligned on the second time the page loads.

To fix that issue please go to your Shopify Admin -> Themes -> Edit HTML/CSS -> assets/responsive-thumbnails.js, look for the following piece of code (it should be in the end of the file):

images.find("img").last().on("load", function(e) {
    window.resizeAll();
})

And replace it with the following one:

images.find("img").last().on("load", function(e) {
    window.resizeAll();
    setTimeout(function(){ window.resizeAll() }, 1000);
})

$(window).on('load', function(e){
    window.resizeAll();
    setTimeout(function(){ window.resizeAll() }, 1000);
});

 

That should do it!  Still have questions? support@shopifyninjas.com.

Have more questions? Submit a request

1 Comments

  • 0
    Avatar
    Info

    The code at the bottom of my responsive-thumbnails.js file is:

    images.find("img").last().on("load", function(e) {

    window.resizeAll();

    })

    $(window).on('resize', function(e){

    window.resizeAll();

    });

    });

    }

     

    I replaced all of it with the suggested code but no thumbnails appeared after.

Please sign in to leave a comment.
Powered by Zendesk