Support Home > Appearance > Lazy Images

Lazy Images

Lazy Images makes pages load much faster by only loading visible images, waiting to load images that are offscreen as you scroll down.

In an effort to improve and optimize your site’s loading time, Lazy Images provides a significant benefit in page speed and bandwidth and is especially great for users in low-bandwidth or expensive-bandwidth environments, particularly for mobile users.

Please note that this feature is compatible with WordPress core’s Lazy-Loading images feature.

For general features and FAQs, please see our information page.

Activating Lazy Images

  1. Navigate to Jetpack → Settings → Performance.
  2. Scroll to the Performance and Speed section.
  3. Click the toggle to activate Lazy loading for images.

What does it do?

Lazy images filter the post content and modify image tags so that the src attribute loads a transparent placeholder image.

So, for example, <img src="" /> would become something like <img src="" data-lazy-src="" /> .

When JavaScript then loads, it will look for all images in the current view and replace the src attribute with what is in data-lazy-src. This also occurs as the user scrolls down the page and images come into view.

Why does this matter?

Lazy images can drastically improve site performance. With mobile usage of the Internet now surpassing that of the desktop, the majority of our users are likely accessing our content with mobile devices. Site performance optimization is incredibly significant.

By default, when a web page loads, it attempts to also load all of the images that it sees in the source. For a visitor using a desktop browser, the time and bandwidth necessary to load that page may not be an issue.

For mobile visitors, where the view is much narrower and bandwidth is a more significant concern, this full loading can be problematic. That’s using bandwidth to load images that they may not even want to see.

With lazy images, those images will only load when they actually appear on-screen, reducing bandwidth usage by as much as half of what is used without lazy images enabled.

Customizing Lazy Images

The code snippets below provide examples of some of the filters included in the lay images feature. You can add these code snippets to a functionality plugin or to your theme’s functions.php file.

These filters allow you to tweak the lazy image functionality.

Lazy images are set to be enabled for your entire site by default. You can use the filter lazyload_is_enabled to customize when lazy loading should be enabled. For example, if you don’t want lazy images to run on a certain page, you could hook in and disable lazy images for that page.

By default, Jetpack will load a 1×1 transparent gif, but certain implementations may call for something else. The filter lazyload_images_placeholder_image will allow you to specify your own placeholder image.

The jetpack_lazy_images_new_attributes filter will allow you to modify the attributes for a lazy-loaded image as the content is filtered. This is to allow for changes based on more customized and specific implementations.

Exclude specific images

You can instruct Lazy Images to skip any image by adding skip-lazy css class to an image.

You can also use jetpack_lazy_images_blocked_classes filter to set additional CSS class names that shouldn’t be lazy-loaded. For example:

function mysite_customize_lazy_images( $blocked_classes ) {
    $blocked_classes[] = 'my-header-image-classname';
    return $blocked_classes;

add_filter( 'jetpack_lazy_images_blocked_classes', 'mysite_customize_lazy_images' );

Lazy Images and Jetpack Boost

If you use the Jetpack Boost plugin’s Lazy Image Loading feature, turning on and off the Lazy Images feature will also turn on and off the Lazy Image Loading feature in Jetpack Boost.

Lazy Images and Safari

To fix the issue with lazy-loaded images on your Safari browser, please update your Jetpack.

Still having trouble?

Please contact support directly. We’re happy to lend a hand and answer any other questions that you may have.

Privacy Information

This feature is deactivated by default. If you ever need to deactivate this feature, you can toggle the Lazy load images setting in the Speed up your site section from Jetpack — Settings — Performance in your dashboard.

More information about the data usage on your site
Data Used
Site Owners / Users 


For activity tracking (detailed below): IP address, user ID, username, site ID and URL, Jetpack version, user agent, visiting URL, referring URL, timestamp of event, browser language, country code.

Site Visitors 



Activity Tracked
Site Owners / Users 


We track when, and by which user, the feature is activated and deactivated.

Site Visitors 



Data Synced (Read More)
Site Owners / Users 


We sync a single option that identifies whether or not the feature is activated.

Site Visitors 



  • Table Of Contents

  • Categories

  • Contact Us

    Need more help? Feel free to contact us.