Dark Overlays in Headers stopped working

Dark overlays, and all overlays in general, have suddenly stopped working. Overlays in blocks show up fine in Guttenberg, but when published, the pages/posts don’t show them at all. Also, the dark overlay in header no longer shows up. It seemed to be working fine yesterday.

I removed any Additional CSS. I deactivated all plug-ins. I viewed the website in both Safari (macOS and iOS) and Chrome. I am using the latest versions of Wordpress, plugins, OS, iOS, and web browsers.

Thanks so much!

I tried a different background color on the block overlays in Guttenberg and they worked. I’ve noticed that Inspiro doesn’t seem to render certain colors. It seems to ignore #000000 and renders it white or transparent, instead. I think the issue is related and why the dark overlays in headers isn’t working if the color used for the overlay is black.

Hi @jasonrjohnston,

If you’re referring to the Cover block, then try to pick the Overlay color using the color picker:

The default colors are currently used by the theme only for Buttons blocks, but we’ll add soon support for cover block too.

Regarding the header overlay, are you referring to the header area where the featured image appears in posts and pages? Maybe you can send us a link to such a page or a screenshot, so we can understand to which area you’re referring.


The video that plays on the home page should have a dark overlay.

This page – https://www.jasonrjohnston.com/equipment/ – is an example of the dark overlay not present on the header.

On single pages, most probably you’ve disabled the overlay in header from Theme Options:

As for the homepage video, I see that it has an overlay already - https://d.pr/v/mK2K2N

You can customize the homepage slideshow overlay from Customizer > Homepage Slider: