Canvas Support

masonry not working as expected

3 replies · opened Dec 9, 2023

PpixelsalsaDec 9, 2023

hi - i have an image gallery that is generated dynamically

https://redhousebarn.co.uk/gallery/index-test.php

you can see that the images aren't nesting together as expected

I'm using

<div class="masonry-thumbs grid-container row row-cols-3 has-init-isotope" data-big="2" data-lightbox="gallery">
<?php do { ?>" data-lightbox="gallery-item">" alt="<?php echo $row_rs_gallery['Title']; ?> "class="lazy lazy-loaded"><?php } while ($row_rs_gallery = mysql_fetch_assoc($rs_gallery)); ?>
</div>

please help

thanks
dan

PpixelsalsaDec 10, 2023

i have fixed this myself now - thanks though

SSemicolon WebSTAFFDec 11, 2023

Hello,

Thanks for your Kind Patience!

Glad your issues were resolved. We would recommend never to use the .has-init-isotope Class by default, as it will not initialize the Gallery Layout correctly using Isotope, as it gets added by JS when the Layout has been completed. Additionally, Gallery with Filters and Text Overlays are supported by default: https://canvastemplate.com/gallery-filter.html and the BG Overlay codes are usable within any Layout.

Additionally, always make sure that there are no JS Errors in the Console as it may cause unexpected issues and not initialize the JS Plugins including Isotope properly.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard