Lazy Load Settings

Lazy loading helps improve page speed by deferring the loading of images, iframes until they actually appear inside the user’s viewport. This reduces unnecessary resource loading and improves overall performance—especially on media-heavy pages.


📌 Image & Media Lazy Loading

Lazy Load Images

Loads images only when the user scrolls near them.
This reduces initial page weight and significantly improves Largest Contentful Paint (LCP).


Lazy Load Iframes

Delays loading of embedded content (e.g., YouTube, Vimeo, Maps) until visible.
Greatly improves page responsiveness and reduces early network requests.


📌 Exclude Critical Elements

List CSS selectors or post IDs that should NOT be lazy loaded.

Examples:

 
.logo, #hero-banner, .important-class, 123

Useful for:

  • Logos

  • Above-the-fold images

  • First-screen hero sections

  • LCP elements


📌 Additional Settings

Enable Responsive Image Support (srcset/picture)

Keeps native WordPress responsive image features enabled during lazy loading.
Ensures browsers choose the best-size image for every screen resolution.


📌 Custom Placeholder Image

Use a custom placeholder while images are lazy loaded.

Examples:

  • A branded loading icon

  • A blurred tiny preview

  • A spinner GIF

To set a custom placeholder:

  1. Click Upload

  2. Select your placeholder from the Media Library

  3. The URL will appear in the field below

The placeholder will be shown until the real image loads.


💾 Save Settings

Click Save Settings to apply your lazy loading configuration.
Your website will immediately begin lazy loading content based on your selections.