Do you want to implement lazy load on images in your WordPress site? When you setup a lazy load for images, your image will load only when a user scrolls down your page.
The main reason for using it is that it greatly improves the loading speed of any website. Here is an Ultimate Guide – How to Speed up WordPress Website
In this article, I’ll tell you how to implement lazy loading on images in WordPress.
Why Implement Lazy Load on Images
When most visitors visit a site, only wait a few seconds to open a page and then exit which increases the site’s bounce rate.
Also, Google uses the website loading speed as a ranking factor. The faster site gets a better rank in Google search result.
Images take a lot of time to load compared to other elements. And if you add many images to your article, it greatly affects page load speed.
In this situation, lazy loading speed up WordPress site load time. There is a lot of Lazy load plugin available in the WordPress repository. Just, you will need to choose a good plugin.
How does Lazy Load Images Work
lazy load only loads images that will appear on the user’s screen. In simple words, when a user scrolls the website page, the images will be loaded.
It greatly improves your website loading speed and gives fast experience to visitors. If you are ready to implement lazy loading for images, continue reading the article.
How to Implement WordPress Lazy Load on Images
Here I will tell you about 3 plugins that help to enable Lazy Load for Image:
- BJ Lazy Load
1. Setting up Lazy Load using BJ Lazy Load
First, install and activate the BJ Lazy Load plugin on your site. It is very popular and best lazy load plugin for WordPress site and active on more than 80,000 WordPress website.
Once activated, click on Settings >> BJ Lazy Load. This will take you to the plugin’s Settings page. As you can see in the screenshot.
You can apply Lazy loading to content, text widgets, post thumbnails, gravatars, images, and iframes.
Furthermore, it has an option to show low-resolution version image in your site. To use this feature, you have to regenerate image sizes. I don’t recommend.
2. Setting up Lazy Load using Jetpack
If you are already using the Jetpack plugin on your site, you will not need to install the lazy load plugin separately.
Just click on Jetpack >> Settings >> Performance and in the “Performance & speed” section, enable the “Enable Lazy Loading for images”.
3. Setting up Lazy Load using Autoptimize
To implement Lazy Load, click on Settings >> Autoptimize. Then go to the Image section and check “Lazy-load images?” box.
Here are more Lazy Load plugins that you can use.
A3 Lazy Load is very easy to use. It also includes iFrame and video lazy load feature. There are many more settings and customizations that you can use for your blog.
If you do not want any kind of settings or customization for lazy load then the Lazy Load plugin can be the right choice for you. It does not have any type of settings or customizations. just install and activate it on your blog or website. It will automatically start working on your blog.
This plugin also does not offer you any type of settings or customizations option. You only need to install and activate it on your blog or website, the plugin will automatically start working on your blog.
Lazy Load by WP Rocket plugin applies to your content image, widget image, post thumbnails, Gravatars, iframes. Additionally, it improves site load time by reducing HTTP requests to your site.
This is a lightweight jQuery lazy load plugin that reduces the number of requests on your blog and improves page load time. It reduces the number of HTTP requests using the data URI scheme.
If you are already using Jetpack and Autoptimize plugin on your site, then I would advise you to setup Lazy Load for Images using one of these plugins.
Since BJ Lazy Load has not been updated for two years. Therefore, it can compromise your site security.
What did you think of today’s post? Let me know by leaving a comment below.
Find this article helpful? Don’t forget to share!