When configuring a solid background color (e.g., 100% opacity white, dark, or custom color) for the Lightbox overlay in the Divi Gallery Extended module settings, the webpage content behind the lightbox may still remain partially visible (see-through / semi-transparent).

Root cause

The lightbox feature in Divi Gallery Extended uses the Magnific Popup script engine. By default, the script applies a global container opacity property (opacity: 0.8 or lower) to the background overlay element (.mfp-bg).

Because this script-level opacity applies directly to the container holding the background color, any solid color set within the builder settings is rendered with partial transparency.

Solution and implementation

To override the script’s default container opacity and render the lightbox background 100% solid, add a small Custom CSS rule in Divi Theme Options.

Step-by-step instructions:

1. Log in to your WordPress Dashboard.
2. Navigate to Divi > Theme Options.
3. Under the General tab, scroll down to the Custom CSS section.
4. Add the following CSS code:

.mfp-bg 
{    opacity: 1 !important;
}

5. Click Save Changes at the top or bottom of the Divi Theme Options page.
6. Clear your Browser Cache and any active caching plugins (e.g., WP Rocket, W3 Total Cache, or Divi Static CSS File Generation).