Some images are not lazyloaded

Problem

Some images are not lazyloaded
PageSpeed lists some images under "defer offscreen images"

If you've already activated LazyLoad, and have verified the page is cached, but are finding some that are not LazyLoaded, there's a few possible reasons.

WooCommerce product gallery

These images use the data-src attribute which is on the compatibility list below.

The images are excluded for compatibility

When the code of the image contains certain attributes which are known to be used for conflicting purposes, they are automatically excluded.

If you want to check this for your site:

Visit your page while bypassing WP Rocket, by adding ?nowprocket to the URL, e.g. http://example.com?nowprocket
Go to View > Page Source to see the HTML
Find the image that isn't LazyLoaded. Check the <img> tag for any of the following attributes or values which will cause the image to be excluded from LazyLoad:

data-src
data-no-lazy
data-lazy-original
data-lazy-src
data-lazysrc
data-lazyload
data-bgposition
data-envira-src
fullurl
lazy-slider-img
data-srcset
class="ls-l
class="ls-bg
soliloquy-image
loading="eager"
swatch-img
data-height-percentage
data-large_image
avia-bg-style-fixed
data-skip-lazy
skip-lazy
class="skip-lazy"
image-compare__

Images encoded in Base64

Background images with Base64 encoding are not lazyloaded to ensure compatibility.

Background images and Bridge Theme

LazyLoading of background images for Bridge theme is disabled for compatibility

Conflict with ShortPixel Global WebP rewrite

When this feature in ShortPixel is activated, our LazyLoad doesn't work correctly.

The markup isn't supported

This is most commonly related to background images, which need to be in a specific format to be LazyLoad-ed.

A common case is background images from Elementor which are loaded in separate CSS files instead of in the HTML directly. In that case you may try this plugin (no affiliation with WP Rocket): Lazy Load Elementor Background Images.
Another case of not supported markup is where there are no double quotation marks around the value of the src attribute.
- Non-supported markup:
  <img src=https:/website.com/folder/image.png class="photos">
- Supported markup:
  <img src="https:/website.com/folder/image.png" class="photos">

Conflict with another LazyLoad script

If your theme or another plugin is also adding LazyLoad, this could cause conflicts and our LazyLoad may not work as expected.

The image is injected into the page after it loads

WP Rocket can only detect images which are present in the HTML when the page loads. If a plugin is injecting images into the page with JavaScript after the page has loaded, they will not be LazyLoaded.