Masonry gallery is not visible

Hey rixi,

Thank you for the inquiry.

We are not yet sure what is causing the issue, but adding the following script in the functions.php file might help.

add_action('wp_footer', 'ava_auto_resize');
function ava_auto_resize(){
?>
<script>
(function($){	
	var int = window.setInterval(function(){
		$(window).trigger('resize');
	}, 1500);
	
	$(window).on("load", function () {	
		setTimeout(function() {
			clearInterval(int);
		}, 500);
	});
})(jQuery);
</script>
<?php
}

Please make sure to purge the cache before testing the page again.

Best regards,
Ismael

Hi,

Thank you for the update.

The masonry items are now displaying on our end, but the issue still occurs randomly. To fix this intermittent issue and make sure that the items are always visible, we edited the script in the functions.php file a bit. However, the changes also disable the animation of the modified masonry element.

This is the modified script in the functions.php file.

add_action('wp_footer', 'ava_auto_resize'); function ava_auto_resize(){ ?> <script>
(function($){   
		$(document).ready(function() {
			var masonry = $('.av-lkxoac3p-fdb26766bf677dcbcb91121eba03e5ce');
			masonry.css('opacity', 0);
			
			var int = window.setInterval(function(){
                $(window).trigger('resize debouncedresize');
			}, 2000);

			$(window).on('load', function () {     
					setTimeout(function() {
							clearInterval(int);
					}, 500);
			});
			
			if ($('body').hasClass('page-id-7579')) {
               $(window).scroll(function(){
					if(masonry.css('opacity') == 0) {
						masonry.css('opacity', 1);
						// masonry.find('.av-masonry-entry').css('opacity', 1);
						// masonry.find('.av-masonry-entry').css('visibility', 'visible');
                                                masonry.find('.av-masonry-entry').addClass('av-masonry-item-loaded');
						$(window).trigger('resize debouncedresize');
					}
			  });
            }
		});
})(jQuery);
</script>
<?php
}

Please make sure to purge the cache or switch to incognito mode before checking the page.

Best regards,
Ismael