I'm experiencing a Cumulative Layout Shift (CLS) issue on my site using the Raydon WordPress theme.
Problem description:
On first page load (cold load, incognito mode, or after cache clear), certain sections (especially the services/diensten page) render incorrectly:
Content blocks (text + icons) are stacked vertically (one under the other), like default block/column behavior without flex/grid applied.
The layout looks broken/misaligned for 1–3 seconds.
After a simple refresh (F5 or Cmd+R), the layout instantly corrects itself: blocks appear side-by-side in proper columns/grid (2 or more per row), with correct spacing and alignment.
OMGF (Optimize My Google Fonts) installed: fonts locally hosted, font-display: swap enabled, all weights optimized/minimized where possible.
Custom CSS in Appearance → Customize → Additional CSS with min-height on columns/blocks (e.g. .wp-block-column, .vc_column_container, .row etc. min-height: 400px+ !important), flex forced, and "Disable original theme CSS for this code" checkbox enabled.
Cache cleared in Jetpack Boost + browser hard refresh.
Tested in incognito + Slow 3G throttling – reproduces every time on first load.
Additional observations:
No console errors (hydration mismatch, JS errors) visible.
Likely related to late CSS/JS application (theme or page builder init script that applies grid/flex classes or triggers a resize event after DOM ready).
Icons (fingerprint & house-like SVGs/PNGs) might contribute if loaded late without reserved space.
Site uses WordPress + Raydon theme (possibly with WPBakery/Visual Composer or Gutenberg blocks for the sections).
This creates a poor user experience (flash of unstyled content + layout jumps) and hurts Core Web Vitals (CLS score elevated on PageSpeed Insights).
We can’t guarantee that third-party elements will work correctly with AJAX.
In most cases, CSS is loaded in the page header and JavaScript effects are initialized in the footer. With AJAX navigation, the header and footer remain from the initial page load, and only the main content is replaced inside an inner container. Because of that, some third-party assets and scripts may not load or re-initialize properly.
We recommend using our shortcodes, Gutenberg blocks, or Elementor widgets, which are designed and tested to work with AJAX. Alternatively, you can disable AJAX in Customizer → General Settings. If you want to keep AJAX enabled, you can also add the affected page as a custom menu link so it loads with a full refresh and bypasses AJAX.
Hello Support Team,
I'm experiencing a Cumulative Layout Shift (CLS) issue on my site using the Raydon WordPress theme.
Problem description: On first page load (cold load, incognito mode, or after cache clear), certain sections (especially the services/diensten page) render incorrectly:
This happens consistently on:
What I've already tried (no-code fixes):
Additional observations:
This creates a poor user experience (flash of unstyled content + layout jumps) and hurts Core Web Vitals (CLS score elevated on PageSpeed Insights).
Solution: Customizer -> General Settings -> Load Pages With Ajax OFF instead of ON.
Hello Brian,
ok I am glad if this fixed the pb.
We can’t guarantee that third-party elements will work correctly with AJAX.
In most cases, CSS is loaded in the page header and JavaScript effects are initialized in the footer. With AJAX navigation, the header and footer remain from the initial page load, and only the main content is replaced inside an inner container. Because of that, some third-party assets and scripts may not load or re-initialize properly.
We recommend using our shortcodes, Gutenberg blocks, or Elementor widgets, which are designed and tested to work with AJAX. Alternatively, you can disable AJAX in Customizer → General Settings. If you want to keep AJAX enabled, you can also add the affected page as a custom menu link so it loads with a full refresh and bypasses AJAX.
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio