Lazy load images to improve page load times and server bandwidth. Images are loaded only when visible to the user.
Lazy load images to improve page load times. Uses jQuery.sonar to only load an image when it’s visible in the viewport.
This plugin is an amalgamation of code written by the WordPress.com VIP team at Automattic, the TechCrunch 2011 Redesign team, and Jake Goldman (10up LLC).
Uses jQuery.sonar by Dave Artz (AOL).
add_filter( ‘lazyload_images_placeholder_image’, ‘my_custom_lazyload_placeholder_image’ );
function my_custom_lazyload_placeholder_image( $image ) {
return ‘http://url/to/image’;
}
You can use the lazyload_images_add_placeholders helper function:
if ( function_exists( 'lazyload_images_add_placeholders' ) ) $content = lazyload_images_add_placeholders( $content );
Or, you can add an attribute called “data-lazy-src” with the source of the image URL and set the actual image URL to a transparent 1×1 pixel.
You can also use output buffering, though this isn’t recommended:
if ( function_exists( 'lazyload_images_add_placeholders' ) ) ob_start( 'lazyload_images_add_placeholders' );
This will lazy load all your images.