Learn how to use Litespeed Cache Lazy Load. Our LiteSpeed Support team is here to help you with your questions and concerns.

About Litespeed Cache Lazy Load

LiteSpeed Cache Lazy Load is a feature offered by the LiteSpeed Cache plugin for WordPress websites. It helps optimize the loading speed of web pages by implementing lazy loading for images.

Lazy loading is a popular optimization technique. It involves loading visible content but delaying the downloading as well as rendering the content appearing below the fold.

In other words, this technique delays the loading of images until required, especially when they are about to become visible on the user’s screen as they scroll down the page. Rather than loading all the images at once as the page loads, lazy loading loads images dynamically when the user interacts with the content.

Since Google favors this technique, it is a good idea to use it if our pages or posts include several embedded videos and high-resolution images.

The LiteSpeed Cache plugin offers lazy loading functionality into WordPress websites by replacing the image source attribute with a placeholder initially. When the user scrolls down, the plugin detects the image’s visibility and replaces the placeholder with the actual image source. In other words, it triggers the image to load at that point.

How to configure Lazy Loading with the LiteSpeed WordPress plugin

Now, let’s take a quick look at how to configure lazy loading with the LiteSpeed WordPress plugin:

1. First, we have to head to the Page Optimisation settings in LiteSpeed.
2. Then, head to the Media Settings tab and enable Lazy Load Images.
3. After that, we have to enable Responsive Placeholder as well.
4. Next, in case our website uses iframes we have to enable Lazy Load Iframes.
5. Then, enable Inline Lazy Load Images Library as well and click Save Changes.
6. At this point, we have to switch to the Media Excludes tab and exclude certain images from being lazy-loaded if required.

   Our experts recommend excluding all the fold images by adding one class
   Furthermore, we can prevent lazy loading as well on a page-by-page basis.
7. Finally, click Save Changes and clear the cache so that the changes go live.

[Need assistance with a different issue? Our team is available 24/7.]

Conclusion

To conclude, our Support Techs demonstrated how to set up Litespeed Cache Lazy Load for a better user experience.