Button Formatting & Image Loading

Hey Aidan,

I suspect both of these issues might be caused by the configuration of Speed Booster Pack.

I can see it's trying to defer loading of some of Extra's styles and failing to add them back in correctly (it's combining several URLs into one, resulting in neither stylesheet being loaded). I haven't yet worked out if its affecting the button styles in this way, but it seems to be affecting the loading of fonts at a minimum.

Likewise, I haven't directly worked out yet if it is actually responsible for the slider issue, but I know some performance plugins will delay loading until the user actually interacts with the page, so possible that is what is happening here - it's not loading the slide images until you actually click on the page.

I'd suggest temporarily disabling Speed Booster Pack to see if the issues clear up. If that fixes the issue, then it may then be possible to narrow down which specific settings are causing the issues.

But if the issues remain after that, let me know and I'll try to do some more digging.

 

Thanks Aidan, that does help.

I was suspecting Speed Booster Pack mainly because I could see that it was active. But now I can see that there are other performance plugins at work as well. The same issues I mentioned before with the combined URLs is still present. So I'd say that Speed Booster Pack is off the hook.

I think the best next step would be to temporarily disable the other performance plugs to see if that solves either issue. Specifically, disable:

A3 Lazy Load
Autoptimize
Cache Enabler
Speed Optimizer

Maybe disable them all at once and see if the issues clear up. If they do, then re-enable them one at a time to see which one causes the issue to reappear. If the issue is still there with them all disabled, let us know and we can look at what to do next.

 

You're very welcome, Aidan.

It looks like the only color being set on the slide titles is the site-wide link color. As this is semi-transparent black, the title is essentially invisible on the background. You may be able to solve this by setting the title color in "Slider Settings > Design > Title Text". The title is currently a "h2" header, so when setting the title style make sure you have the Title Heading Level set to "h2".

If that doesn't help, you could set the title color manually by adding this CSS into "Divi > Theme Options > General > Custom CSS":

Code:

body.home .et_pb_slide_title a {
    color: #fff;
}

I'm not familiar enough with A3 Lazy Load to offer specific settings, but you could try selectively enabling / disabling settings to see if you can find a configuration that gives you some of the plugins benefits while avoiding the negative impact on the site. Also, you may want to test the site speed with / without lazy loading to get a feel for how much of a benefit A3 Lazy Load brings to the site. If it's minimal you may want to just remove it. But if it has a noticeable benefit, you may want instead look into a plugin such as Divi Nitro that does optimizes image loading but is designed specifically for Divi so should handle things like the slider correctly:

https://diviengine.com/product/divi-nitro/