Skip to main content

Background Images

What it does

Background Images holds section, row, and column background images until they are near the viewport so the first screen loads faster. The first background stays visible for Largest Contentful Paint (LCP).

This is separate from Smart Image Loading (content images) and Lazy Rendering (whole sections).

Where to find it

Divi Engine → Nitro Settings → Background Images

Settings

SettingTypeDefaultWhat it does
Lazy Section BackgroundsToggleOffBackgrounds below the fold load just before they enter the screen. The first background loads immediately
Early load distanceNumber (px)1000How far ahead to start loading. Higher values reduce white flash while scrolling. Recommended: 300–500 if you see flashes
Balanced and Aggressive presets

Balanced and Aggressive turn Lazy Section Backgrounds on. Safe leaves it off.

Legacy: manual row / module backgrounds

Older setups assigned a custom ID and URL to up to ten background slots. Prefer Lazy Section Backgrounds for new sites. Existing slots keep working.

SettingTypeDefaultWhat it does
Background image timeoutNumber (ms)1000Delay before these manually configured backgrounds load
ID (slots One–Ten)TextemptyCustom CSS ID on the section, row, or module
URLTextemptyBackground image URL for that slot
Enable ParallaxToggleOffMatch a parallax background in the Divi Builder
CSS or True ParallaxToggleOff (CSS)On = true parallax, Off = CSS parallax
Legacy Help Scout URL

Older docs called this Defer Background Images. That article now points here.

What's Next