This plugin lazyloads background images
Author: | Proloy Bhaduri (profile at wordpress.org) |
WordPress version required: | 5.2 |
WordPress version tested: | 6.5 |
Plugin version: | 1.0.7 |
Added to WordPress repository: | 30-07-2022 |
Last updated: | 31-03-2024 |
Rating, %: | 100 |
Rated by: | 2 |
Plugin URI: | |
Total downloads: | 4 731 |
Active installs: | 400+ |
Click to start download |
This plugin will delay the loading of background images in your website and thus helps boosting the website loading time by reducing total number of HTTP requests.
Quick Notes & Links
- Do not lazyload background images which are peresent above the fold because this will increase time to First Contentful Paint(FCP) metric and affect the speed of your website .
- Background images that are added using inline CSS e.g,
<p style=" background-image: url( path/to/background-img.jpg )" > </p>
are lazyloaded by this plugin by default . - No dependencies required for this plugin to work.
- No extra HTTP request
- Add the selectors of the elements that have background images in the plugin settings page or add
lazyload-bg
class to the element . - WordPress Tips and Tricks By Proloy Bhaduri
- Buy me a Coffee
Works smoothly with almost every page builders
Exclude certain inline background images from lazy loading using filter hook lazyload_inline_bg_excludes
add_filter(‘lazyload_inline_bg_excludes’,function($exclude_keywords){
$exclude_keywords = [
‘bg-image.jpg’,
‘class-name’,
‘id’,
‘or any unique keyword that the element with background image has’
];
},10,1);
Note: Add the above code to the functions.php
file of your active theme/child theme or using a code snippets plugin.
ChangeLog