Most WordPress sites already have lazy loading enabled. Since WordPress 5.5, core adds the native HTML loading="lazy" attribute to eligible images, so you usually need to verify the generated markup—not install another plugin. The important exception is the image visible when the page first opens: your hero or likely Largest Contentful Paint (LCP) image should normally load immediately.
What WordPress lazy loading does
Lazy loading tells a browser to delay downloading an image until it is close to the visible part of the page. Images below the fold can therefore avoid competing with immediately visible content and images that a visitor never reaches.
WordPress introduced native image lazy loading in version 5.5. For eligible <img> elements, core can add loading="lazy" automatically. Browsers that do not support the attribute simply ignore it, so it is progressive enhancement rather than a separate WordPress service.
Core’s original implementation also relied on image dimensions. Supplying both width and height lets the browser reserve the correct aspect-ratio space before the file arrives, reducing layout movement.
Recommended Free Tools
#1 Best Overall
- easy to use
- Free app
- Compatible with all devices
- It gives the best comparison between ten different hosts
How to check whether it is already enabled
- Open a page that contains several images.
- In your browser, right-click and choose Inspect, or use View Page Source.
- Find an image that appears well below the first viewport.
- Check its rendered tag for
loading="lazy", plus explicitwidthandheightattributes. - Inspect the first viewport separately. Confirm that the hero or principal image is not being unnecessarily delayed.
Inspect the rendered output rather than relying only on editor settings. A custom theme, page builder, or optimization plugin may generate or modify the final tag after WordPress processes the post content.
What to do when an image is missing the attribute
Check the image markup first
If a lower-page image has no loading attribute, check whether the tag has dimensions and whether a theme or plugin created the markup outside the normal WordPress image functions. Native behavior applies to eligible output; it is not a guarantee for every custom HTML image.
Do not install a plugin automatically
A plugin is not normally required to turn on native lazy loading. Adding a second optimization layer can create conflicting rules, especially when both a theme and a plugin alter loading, fetchpriority, or decoding. Identify which component produces the tag and test the final page after changing one component at a time.
Keep dimensions on every content image
When you write custom HTML, include both dimensions, for example:
<img src="example.jpg" width="1200" height="800" alt="Description" loading="lazy">Use the file’s intrinsic dimensions or the displayed aspect ratio; do not add arbitrary values that distort the reserved space.
Do not lazy-load the hero or likely LCP image
Lazy loading is intended mainly for below-the-fold images. Delaying an image that is visible immediately can make the page’s main content appear later and can worsen Largest Contentful Paint. WordPress core refined its behavior in 2021 specifically because indiscriminate above-the-fold lazy loading could regress LCP.
The correct exception depends on the active theme and layout. A logo, banner, featured image, or first article image may be in the initial viewport on one template and below it on another. Inspect the actual page at representative desktop and mobile widths instead of assuming that every first image has the same role.
| Image location | Typical treatment | Reason |
|---|---|---|
| Clearly below the fold | loading="lazy" |
Defers a request the visitor may not need immediately. |
| Hero or likely LCP image in the first viewport | Omit lazy loading so it can load promptly | A delayed main image can hurt perceived speed and LCP. |
| Logo or header image visible immediately | Evaluate the rendered layout; omit lazy loading when it is an initial-viewport asset | Header content can be part of the first visual result. |
Control lazy loading with WordPress hooks
Adjust one image tag
The wp_img_tag_add_loading_attr filter controls the value WordPress adds to an image tag. Returning false or an empty string omits the attribute for that case. Use a narrowly scoped condition for a known above-the-fold image rather than disabling lazy loading globally.
The Tool Desk
Outbyte Driver Updater FREEFix the driver behind crashes, sound loss and screen glitchesFind Drivers →Outbyte PC Repair FREERepair Windows errors before they cause bigger problemsFix Now →add_filter( 'wp_img_tag_add_loading_attr', function ( $value, $image, $context ) {
// Add a specific, well-tested condition here for an above-the-fold image.
if ( /* your condition */ ) {
return false;
}
return $value;
}, 10, 3 );Because the condition is theme-specific, do not copy a generic selector and assume it identifies your hero image. Test the resulting HTML and the first viewport after implementing it.
Best Value
- Free WordPress Hosting Guide Android Application. It Contains: A Brief Overview of WordPress Hosting, 9 Major Benefits of Managed WordPress Hosting.
- 5 Simple Steps to Choose WordPress Hosting, How to Maximize Your WordPress Hosting and Blogging Success, How to Choose the Best WordPress Hosting Provider, Optimize Your Blog with VIP Word.
- Press Hosting, What You Should Know to Choose the Best WordPress Hosting and Much More.
Control whether a tag type is eligible
wp_lazy_loading_enabled() determines whether WordPress adds a loading attribute for a tag and context. The developer reference documents img and iframe as enabled by default. A broad filter here affects many elements, so reserve it for a deliberate theme-level policy.
Use the current loading-optimization API for broader logic
WordPress 6.4 centralized more loading decisions in wp_get_loading_optimization_attributes(). It coordinates modern attributes and preserves existing loading, fetchpriority, or decoding values rather than blindly overwriting them.
The older wp_get_loading_attr_default() function is deprecated in favor of the centralized API. New theme code should use the current API and its documented filters, while existing code should be reviewed for compatibility with the WordPress version installed on the site.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
A practical troubleshooting checklist
- No
loadingattribute on a lower-page image: confirm the image has dimensions and determine whether custom HTML, a builder, or a plugin produced it. - Hero image loads late: remove lazy loading for that specific image and check whether another optimization layer is adding it back.
- Layout jumps while images load: add accurate
widthandheightvalues or otherwise preserve the image’s aspect ratio. - Conflicting optimization settings: disable overlapping rules one at a time, inspect the rendered tag, and retest both the initial viewport and lower-page images.
- Results vary by template: inspect each relevant template at desktop and mobile widths; “above the fold” is a layout condition, not a universal image position.
Native WordPress behavior versus custom control
| Approach | Best for | Trade-off |
|---|---|---|
| Native WordPress behavior | Standard content images, with normal dimensions and no special layout requirement | Requires checking that custom markup remains eligible. |
| Theme or plugin filter | A documented exception such as an above-the-fold hero image or a custom rendering context | More control, but incorrect conditions can delay LCP images or disable useful deferral. |
| Multiple optimization layers | Only when their responsibilities are clearly separated and the final output is tested | Conflicting attributes and unpredictable template-specific behavior are possible. |
How to verify the change after editing
- Clear any page-cache or CDN cache that may serve old HTML.
- Inspect a below-the-fold image and confirm its lazy-loading attribute and dimensions.
- Inspect the first viewport and confirm the principal image is fetched promptly.
- Repeat the check on the templates and screen sizes your site actually uses.
- If you changed a filter, review the final tag for unintended changes to
fetchpriorityordecoding.
There is no universal speed percentage that every WordPress site gains from lazy loading. The benefit depends on how many images are below the fold, their sizes, the page layout, and the visitor’s connection. Treat the general web observation that sites at the 90th percentile sent about 4.7 MB of images on desktop and mobile (a figure attributed to HTTPArchive in a 2020 WordPress core announcement) as context, not as a guaranteed result for your site.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
