Refresh after update

  • Resolved nickster72

    (@nickster72)


    4 years, 5 months ago

    Hi, after the recent Kadence block update I later found that where ever I used the Mosonary Advanced Gallery block, the images I used were not showing correctly. Instead, all the images were stacked and overlapped on top of each other.

    To fix this and to nudge a change, I had to change the layout to a grid, then save, then go pick masonry again and save.

    QUESTION: After an update like this, what can I do to invoke what I did above to the whole site to get your blocks to display as intended? I hope the answer does not require me to go through the whole site to fix every occurrence of this type of fix.

    Thanks in advance for your help.
    Nicolas

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)

  • Hi, It sounds like (looks like from your link: https://share.getcloudapp.com/o0umpp1B ) you have a lazy loading issue. So not really an issue with the block just more that lazy load on your site is preventing the image from loading until scroll which prevents the grid from sizing correctly. Meaning that if you disabled lazy load it would work without doing any updates in pages.

    However, to back up the block “can” support lazy load out of the box as long as your images are set to show in a specific image size.

    When you first upload images into the Block editor it is working behind the scenes to create smaller versions of each image for use on your site. There it’s also assigning metadata for the image like it’s size and ratio.

    Sometimes depending on how many images you are uploading at once and the speed of your server it’s possible for the block editor to appear like it’s all done uploading your images but it’s still working behind the scenes.

    When you click to add to the gallery it’s at that exact moment when the Kadence Gallery block tries to access the information about your images so that it can load them with css placeholders that match the image ratio so you get a really great lazy load experience (no re-rendering of the page and moving of items as the images load on scroll). It happens at that moment because the gallery block is a static block, just saved HTML and not a block that does of a bunch of rendering on page load.

    When I look at your link above this information that would allow for css image ratio placeholder is missing from the gallery output which means at the point at which you added the images that information wasn’t available. It’s possible it still isn’t I can’t know that from the front end.

    However, what you would need to do to support lazy loading for a masonry gallery is to edit that gallery and make sure to set the proper thumbnail image size. When you do this you force the block to re-ask WordPress for information about each image so that it can build a css image ratio placeholder. See here:

    https://share.getcloudapp.com/xQuAppY0

    So can we test this theory on the page you linked to? can you go in and set the size of the thumbnails (this will also really help with loading) and see what happens?

    Thanks

    Ben

Viewing 1 replies (of 1 total)
  • The topic ‘Refresh after update’ is closed to new replies.