Here Is How You Disable Lazy Load In WordPress (2 Methods)

WordPress uses a browser-native Lazy Load to help speed up the overall loading time of your website. Sometimes this lazy load can cause issues, which is why you sometimes need to turn it off.

You can easily turn off the native Lazy Loading in WordPress by installing the plugin: Disable Lazy Load. It’s tested up to WordPress version 6.0.1, and all you have to do is to install and activate it. Then the plugin will take care of the rest.

Lazy load is made to help your website load faster. What it means in basic is that an image doesn’t use server resources on loading until it reaches the browser viewport.

For example, if you have an image in your footer, but you never scroll down to the footer. Then the image never loads.

There can be many reasons why you want to disable the native lazy loading from WordPress. If you’re using an optimisation plugin like Smush or Shortpixel, they also have lazy loading implemented. This can sometimes conflict, so you might want to turn either WordPress lazy loading off or the plugin lazy loading.

Another reason would be that you just want all images to load ASAP without delay. Then you should turn off lazy loading as well.

Disable Lazy Load In WordPress In Functions.php

If you have just a bit of PHP experience, I recommend you go with this option. You just need to add a line of code to your functions.php file in your theme folder, and then the native lazy load has been disabled. Add the following line:

add_filter( 'wp_lazy_loading_enabled', '__return_false' );

In the menu, hover on appearance and click on Theme editor. In the right panel, make sure you’re editing functions.php. Otherwise, click on it.

[cboxarea id=”cbox-DZ7YzH84qT48YAf1″]

Then, you simply add the line at the bottom and press update file.

The following line of code is the line you need to add to your functions.php:

add_filter( 'wp_lazy_loading_enabled', '__return_false' );

Disable Lazy Load Using a WordPress Plugin

If you want to ensure everything happens accordingly, you don’t want to mess around with any PHP. Then installing and activating the plugin Disable Lazy Load is the right solution for you.

It’s super easy to set up. Once you’ve installed and activated it, the plugin will take care of the rest; there are no settings or anything you need to change or set.

Disable Lazy Load

How do I enable lazy loading in WordPress?

You do not need to enable lazy load when using WordPress. It’s enabled per default as it was introduced in WordPress version 5.5 in mid-2020.

It adds an attribute to all your images loading=”lazy” to ensure they lazy load.

WordPress utilises the browser-native lazy loading to help your website lazy load your images. This results in your WordPress website loading faster.

Disable Lazy Load For A Specific Image In WordPress

If you’re using a caching plugin such as WP Rocket, Shortpixel, or similar, then in your plugin settings, you can disable lazy load for specific images. Go to your plugin settings, find the tab named exclusions and then add the full URL to your image.

Why would you disable lazy load in the first place? Often when your image is above the fold, your image should load immediately and not be slowed down by lazyloading. This can affect your performance score and affect your SEO profile negatively.

Now to disable lazy loading for a specific image in WordPress, it requires we insert a code snippet in Appearance -> Theme Editor and then choose the file named functions.php. Scroll to the bottom and insert the following code snippet:

function disable_lazyload_for_images( $value, $image, $context ) {
  if ( 'the_content' === $context ) {
    $image_url = wp_get_attachment_image_url( 1448, 'large' ); 
    if ( false !== strpos( $image, ' src="' . $image_url . '"' ))
      return false;

  }
  return $value;
}
add_filter( 'wp_img_tag_add_loading_attr', 'disable_lazyload_for_images' );

In line 3, where you see the id 1448, this is the id of the image you want to disable lazyload for. This you need to replace with your image id. To find the image id, you go to your media library and click on the image which you want to disable lazyload.

Then in the URL, you will see ?post={ID}. This is where your id is. So copy this id and insert it into your code snippet instead of 1448, and press the update file in your theme editor.

https://wpenroll.com/wp-admin/post.php?post=1448&action=edit

Does Elementor have lazy loading?

As Elementor runs on WordPress, and WordPress itself has a lazy load as part of it. Then Elementor does run on lazy loading for all images and scripts. This means Elementor doesn’t load your specific image until it has reached your browser viewport. Just like native WordPress does it.

To turn off lazyload for Elementor, you follow the same method as mentioned above by adding the following code snippet to your functions.php file in Appearance -> Theme Editor:

add_filter( 'wp_lazy_loading_enabled', '__return_false' );