Some images load blank on page, ALL load fine on edit?

Hi @b3nb123

Kindly navigate to FooGallery -> Settings and on the “General” tab, clear the HTML and CSS cache. Try this and let me know if it does help.

Thanks.

Kind regards,
Elvis.

Thanks for the reply. Didn’t seem to make any difference though I’m afraid

Hi @b3nb123 & @elviiso,

TDLR; Exclude FooGallery images from your third party lazy loading plugin using the CSS class skip-lazy or disable lazy loading in the FooGallery settings.

The issue here is actually a problem with multiple lazy loads occurring on the images. FooGallery is currently set to lazy load its’ own images, which it is doing, however there is another lazy load plugin altering our gallery markup which is causing the blank images to appear.

As the two lazy loads are essentially racing against each other sometimes the other one completes after FooGallery. This is when you see the blank images.

The reason the other lazy load plugin is producing blank images is because FooGallery with lazy load enabled outputs the thumbnail src as a blank placeholder directly from the server. The other plugin then replaces our placeholder with its own and then tries to load our placeholder as the actual image, resulting in the blank images if it completes after FooGallery.

I would try to configure the other lazy loading plugin to ignore FooGallerys’ images rather than disable its lazy loading. I know our lazy loading works for all our templates and combinations of options. If your other lazy load plugin has an exclude list you should hopefully be able to add the CSS class skip-lazy to it and it should ignore our images as they all have this class applied.

Thanks

SteveUsh – Thanks so much! I firstly tried disabling Foo’s lazy loading, but that actually caused the images masonry layout to screw up, and lower down the page they started running into each other.
So I re-enabled it and instead just disabled the other lazy load plugin.

So pleasing to have pages instantly fill with photos! Perfect.

Thanks so much for your help, I do love this plugin

Does Foo Gallery always remember the last used settings? I haven’t (I don’t remember) saved a set of presets, but my layout, colour schemes etc all load what I did last. Is there a way to make a change, say, number of columns in the masonry layout, to all galleries at once?

@b3nb123 that’s great to hear! I’ll mark this as resolved.

FYI; The reason masonry layout got messed up is that the other lazy load plugin uses a blank 1×1 pixel transparent gif as a placeholder while FooGallery uses a blank SVG with the correct size for that specific thumbnail. Using placeholders with the correct size allows Masonry to correctly lay itself out ??

Hi @b3nb123

On your most recent question of if there’s a way to basically bulk change the Masonry layout settings to multiple created galleries’ at once, this is possible using the Bulk Copy feature.

The bulk copy feature can copy the settings of one gallery (templates & settings) to many or all the other galleries. Here’s a simple guide on the Bulk Copy feature: https://fooplugins.com/bulk-copy-foogallery-pro/

We also have a newer feature called the Master Gallery feature which allows you to use one or more galleries as a master template for other galleries. Any gallery using the Master gallery will adopt the same settings as the Master Gallery. Here’s a guide that’ll get you started with this: https://fooplugins.com/documentation/foogallery/pro-commerce/use-master-gallery/

Kindly note that the Bulk Copy feature is currently available in the Pro Expert plan while the Master Gallery feature is available in the Pro Commerce plan. With that said, I’d encourage you to opt in to our 7-day free trial to try out these features: https://fooplugins.com/documentation/general/faq/start-free-trial/

Thanks.

Kind regards,
Elvis.