Troubleshooting Common Kadence Advanced Gallery Display Issues
Content
The Kadence Blocks Advanced Gallery is a powerful tool for creating beautiful image layouts, but like any complex feature, it can sometimes run into display problems. Based on community reports, here are the most common issues and how to resolve them.
1. Images Not Loading or Gallery Appears Empty
This is a frequent issue where images vanish from both the editor and the front end, even though they exist in the media library.
- Quick Fix: Try re-saving the gallery. Click the pencil (edit) icon within the block, let the gallery editor load, and then click the 'Update Gallery' button. Finally, update the page or post.
- Image Size Setting: An incorrect thumbnail size selection can cause this. In the gallery settings, try selecting a different image size for the thumbnails and then reselect your preferred size. Ensure the chosen size is appropriate for the images you've uploaded.
2. Masonry Layout Order Mismatch Between Editor and Frontend
Users often report that the image order in a Masonry gallery looks correct in the WordPress editor but is different on the published page.
- Why it happens: This is expected behavior. The Masonry layout relies on a JavaScript script that calculates the final positions based on image heights after the page has fully loaded in the browser. The editor can't perfectly replicate this complex calculation.
- The Solution: Unfortunately, you must preview or publish the page to see the true, final order. This is a limitation of the dynamic layout process.
3. Gallery Not Displaying Correctly Inside Tabs, Accordions, or Modals
Placing an Advanced Gallery, particularly a Carousel type, inside a hidden container (like a tab, accordion, or modal) is a common source of problems. The gallery may not render correctly, appear squished, or not function.
- Why it happens: The gallery's initialization scripts often run when the page loads. If the gallery is hidden inside a tab, the script may not be able to calculate its dimensions correctly.
- Potential Fix: The Kadence Blocks team has addressed some of these compatibility issues in past updates. The first step is to ensure your Kadence Blocks plugin is updated to the latest version. If the problem persists, it may indicate an ongoing compatibility challenge with your specific setup.
4. JavaScript Errors (e.g., 'imagesLoaded is not defined')
Some users encounter browser console errors that prevent Masonry galleries from functioning.
- Common Cause: This is almost always a plugin or theme conflict. Another plugin (or sometimes the theme) may be incorrectly handling script dependencies, breaking the core scripts that the Kadence gallery needs to run.
- Troubleshooting Steps:
- Temporarily deactivate all other plugins except Kadence Blocks.
- If the gallery works, reactivate your plugins one by one to identify the culprit.
- Switch to a default WordPress theme (like Twenty Twenty-Four) to rule out a theme conflict.
- Clear all caching, including any caching plugins (e.g., WP Rocket) and your browser cache, after making changes.
5. Responsive Column Issues on Mobile
Galleries may not adjust their columns or image sizes properly on mobile devices.
- The Fix: Within the Advanced Gallery block settings, click on the 'Columns' option. Ensure the 'Individual' control is selected. This will reveal separate column number inputs for Desktop, Tablet, and Mobile, allowing you to explicitly set the layout for each screen size.
General Troubleshooting Tips
For any persistent issue, follow this standard procedure:
- Update Everything: Ensure WordPress, your theme, and all plugins (especially Kadence Blocks) are up to date.
- Conflict Test: As mentioned above, deactivate other plugins and switch themes to identify conflicts.
- Clear Caches: Clear your site's cache (if using a caching plugin) and your browser's cache.
Many display issues with the Kadence Advanced Gallery block can be resolved by methodically checking for conflicts and ensuring your settings are configured for your specific use case.
Related Support Threads Support
-
Advanced Image – Lazy loadinghttps://wordpress.org/support/topic/advanced-image-lazy-loading/
-
kadence Masonry Galleryhttps://wordpress.org/support/topic/kadence-masonry-gallery/
-
srcset not set properlyhttps://wordpress.org/support/topic/srcset-not-set-properly/
-
Backend height causes visual errorshttps://wordpress.org/support/topic/backend-height-causes-visual-errors/
-
Refresh after updatehttps://wordpress.org/support/topic/refresh-after-update/
-
Image order in masonry gallery wrong on webpagehttps://wordpress.org/support/topic/image-order-in-masonry-gallery-wrong-on-webpage/
-
Problems with gallerieshttps://wordpress.org/support/topic/problems-with-galleries-2/
-
Advanced Gallery DoS on JSON APIhttps://wordpress.org/support/topic/advanced-gallery-dos-on-json-api/
-
The Advanced Gallery block don’t imageshttps://wordpress.org/support/topic/the-advanced-gallery-block-dont-images/
-
Advanced Gallery – Image Display Issueshttps://wordpress.org/support/topic/advanced-gallery-image-display-issues/
-
Advanced gallery not selecting right image sizeshttps://wordpress.org/support/topic/advanced-gallery-not-selecting-right-image-sizes/
-
Undefined array key “marginUnit” with advanced galleryhttps://wordpress.org/support/topic/undefined-array-key-marginunit/
-
Cant access row editorhttps://wordpress.org/support/topic/cant-access-row-editor/
-
Advanced Gallery Dynamic Image Rendering on Mobilhttps://wordpress.org/support/topic/advanced-gallery-dynamic-image-rendering-on-mobil/
-
Kadence Import Not Showing Imageshttps://wordpress.org/support/topic/kadence-import-not-showing-images/
-
Gallery images not showing up on mobilehttps://wordpress.org/support/topic/gallery-images-not-showing-up-on-mobile/
-
Issues with advanced gallery mobile display and wp mobile previewhttps://wordpress.org/support/topic/issues-with-advanced-gallery-mobile-display-and-wp-mobile-preview/
-
Advanced Gallery block issue missing Thumbnail Image Sizehttps://wordpress.org/support/topic/advanced-gallery-block-issue-missing-thumbnail-image-size/
-
Skip-lazy problemhttps://wordpress.org/support/topic/skip-lazy-problem/
-
Adbanced Gallery cannot load image correctlyhttps://wordpress.org/support/topic/adbanced-gallery-cannot-load-image-correctly/
-
Advanced gallery isn’t displayed correctly when inserted as html codehttps://wordpress.org/support/topic/advanced-gallery-isnt-displayed-correctly-when-inserted-as-html-code/
-
Advanced Gallery block is very bad for performancehttps://wordpress.org/support/topic/advanced-gallery-block-is-very-bad-for-performance/
-
Advanced Gallery Issues with WPRockethttps://wordpress.org/support/topic/advanced-gallery-issues-with-wprocket/
-
Gallery shows all images on initial loadhttps://wordpress.org/support/topic/gallery-shows-all-images-on-initial-load/
-
Kadence Advanced Gallery Widthhttps://wordpress.org/support/topic/kadence-advanced-gallery-width/
-
Advance Masonry Gallery Not Loading All Imageshttps://wordpress.org/support/topic/advance-masonry-gallery-not-loading-all-images/
-
masonry gallery invisible until browser window is resizedhttps://wordpress.org/support/topic/masonry-gallery-invisible-until-browser-window-is-resized/
-
Advanced gallery shadowhttps://wordpress.org/support/topic/advanced-gallery-shadow/
-
Max height / width for medium sized Gallery images?https://wordpress.org/support/topic/max-height-width-for-medium-sized-gallery-images/
-
Advanced Galleryhttps://wordpress.org/support/topic/advanced-gallery-3/
-
Trying to locate image slider controlshttps://wordpress.org/support/topic/trying-to-locate-image-slider-controls/
-
Problem with advanced gallery masonry typehttps://wordpress.org/support/topic/problem-with-advanced-gallery-masonry-type/
-
Image thumbnail size not showing in Gallery Advhttps://wordpress.org/support/topic/image-thumbnail-size-not-showing-in-gallery-adv/
-
Advanced Gallery – unable to change the highthttps://wordpress.org/support/topic/advanced-gallery-unable-to-change-the-hight/
-
hide an image from Advanced gallery on small mobile deviceshttps://wordpress.org/support/topic/hide-an-image-from-advanced-gallery-on-small-mobile-devices/
-
Problem with Carousel Gallery in Tabhttps://wordpress.org/support/topic/problem-with-carousel-gallery-in-tab/
-
Global Default setting – Advanced Galleryhttps://wordpress.org/support/topic/global-default-setting-advanced-gallery/
-
Image Ratio, Advanced Gallery Carouselhttps://wordpress.org/support/topic/image-ratio-advanced-gallery-carousel/
-
Advanced Gallery Image Alignment CSShttps://wordpress.org/support/topic/advanced-gallery-image-alignment-css/
-
Advanced galleryhttps://wordpress.org/support/topic/advanced-gallery-4/
-
Advanced Gallery Block does not work on mobilehttps://wordpress.org/support/topic/advanced-gallery-block-does-not-work-on-mobile/
-
Advanced gallery is cut and hiddenhttps://wordpress.org/support/topic/advanced-gallery-is-cut-and-hidden/
-
Advanced Gallery – Massive Containerhttps://wordpress.org/support/topic/advanced-gallery-massive-container/
-
Advanced Gallery Block Inside Read more expanderhttps://wordpress.org/support/topic/advanced-gallery-block-inside-read-more-expander/
-
Advanced Gallery Lightboxhttps://wordpress.org/support/topic/advanced-gallery-lightbox/
-
Advanced Gallery Images has width 0pxhttps://wordpress.org/support/topic/advanced-gallery-images-has-width-0px/
-
Error when I try to change gallery to advanced galleryhttps://wordpress.org/support/topic/error-when-i-try-to-change-gallery-to-advanced-gallery/
-
Advanced Gallery column bughttps://wordpress.org/support/topic/advanced-gallery-column-bug/
-
need Gutenburg? and what galleries?https://wordpress.org/support/topic/need-gutenburg-and-what-galleries/
-
Advanced Gallery > invisible in frontend since v1.7.17https://wordpress.org/support/topic/advanced-gallery-invisible-in-frontend-since-v1-7-17/
-
Gallery (masonry) error: imagesLoaded is not definedhttps://wordpress.org/support/topic/gallery-masonry-error-imagesloaded-is-not-defined/
-
Image Not Displaying On Laptop Only and Plugin Generate TOO many Thumbnailshttps://wordpress.org/support/topic/image-not-displaying-on-laptop-only-and-plugin-generate-too-many-thumbnails/
-
Gallery tiles disappear on mobile viewhttps://wordpress.org/support/topic/gallery-tiles-disappear-on-mobile-view/
-
Justifyied galleryhttps://wordpress.org/support/topic/justifyied-gallery/
-
“Thumbnail Slider” Gallery in Modal not workinghttps://wordpress.org/support/topic/thumbnail-slider-gallery-in-modal-not-working/
-
Gallery (Adv) unable to locate resource at Google Lighthousehttps://wordpress.org/support/topic/gallery-adv-unable-to-locate-resource-at-google-lighthouse/
-
Gallery images not showing using Kadencehttps://wordpress.org/support/topic/gallery-images-not-showing-using-kadence/
-
Product Imageshttps://wordpress.org/support/topic/product-images-17/