Image Lazy Loading

Last Update: April 10, 2024

Lazy Loading for images can be enabled under the Performance tab at Avada > Global Options > Performance. What this does is to only load the images that are visible in the viewport. As the user scrolls and more images come into view, they are then loaded as well. This provides an instant benefit to page load times, as only the initial images in the viewport are loaded.

Image Lazy Loading

Where Is Lazy Load Enabled?

Lazy Load is enabled in these areas and elements in Avada:

  • Blog Element – medium, large, grid and masonry

  • Blog Archive – medium, large, grid, and masonry

  • Single Blog Post Featured Image, first and slides

  • Blog Grid with multiple images

  • Portfolio Element – grid and masonry

  • Portfolio Archive

  • Single Portfolio Post Featured Image, first and slides

  • Gallery Element

  • Image Element

  • Image Before/After Element

  • Person Element

  • Testimonial Element

  • Content Box Element

  • Flip Box Element

  • Slider Element

  • Post Slider Element

  • Recent Posts Element

  • Lightbox Element

  • Container background

  • Column background

For more information on How Avada Controls Responsive Images, please see the linked doc.

Skip Lazy Loading

In the Elements themselves, there is also an option to Skip Lazy Loading, which allows you to turn it on universally, and then control the individual Elements to turn it on or off. For example, it you add a logo image to the header, or an image to the top of the page, you would want to skip lazy loading for those resources as they are in the initial viewport.

Applying Skip Lazy Loading

In this article