Multi Masonry and Pagination infinite does not work

[lehmi55]

On the shop page I need to show images mixed in Portrait and Landscape format. So my Woocommerce Catalog Image size is set to width 0px and height 584px to show all images with the same height. The masonry layout is shown correctly for the first block of Products. But the next block, which is shown after scrolling down (pagination infinite), does show up for a second and is invisible then. I can click on an invisible product and I am linking to product details page.

I already deactivated all third party plugins, but not yours and woocommerce, to see if the problem exists. And yes, it still exist.

[David Martin – Support]

I see you have set the pagination to standard, do you mind if we switch this to infinite scroll whilst we look into this.

[lehmi55]

Hi David,

I have switched to ‘Load more (Ajax)’. Is the same error.

[David Martin – Support]

Great, can you test adding this:

.multi-masonry-items .product {
    opacity: 1;
}

[lehmi55]

That’s great! If ‘Load more’ everything is ok. In ‘Infinite’ all remaining images are loaded. However, it is set at ‘Products Per Page’ 7 Thumbs. Is that right?

[David Martin – Support]

Not sure I understand this, does Infinite Scroll not work as expected, it loads all rather than 7?

Thanks.

[lehmi55]

Sorry, it’s all okay. However, this seems to be a solution just for me. When do you plan to release the next update?

Thank you.

[David Martin – Support]

Yes, a fix will be issued but I need to confirm the bug first. Is it Infinite Scroll + Multi Masonry?

Thansk.

[lehmi55]

Yes it’s Infinite Scroll and Multi Masonry. Thank you so much!

[David Martin – Support]

Thanks. Will test and report back to the team.

– David.

[Swift Ideas – Ed]

Thanks for the heads up – we have resolved this for the next update. You can add this css to resolve now:

.multi-masonry-items .product.item-animated {
	opacity: 1;
}

– Ed