Background Images not loading over Live Links when using DIVI

Hi everybody,
I tried to create a site with DIVI, but as you can see in the screenshot,
the live link did’nt work correctly cause some images are not loaded…

How can I fix this issue?
Thanks

Andrea from Milan

We see this sort of thing often with Live Links and page builders. In Divi’s case, you’ll need to disable “Static CSS File Generation.”

This is because when those styles are saved to CSS files, Local has no way of re-writing those style rules.

divi-css-file-creation

Thank you Ben,
can you tell me the path to reach this panel? I usually work with Visual Builder but I never see ‘Page Settings’… I only can change Header, Row, Section…

I don’t use Divi myself, but it looks like it’s part of Divi’s site-level options. This blog post has some screenshots which seem to indicate that this option is located at:

WP Admin > Divi > Theme Options > Builder

I tried disabling Static CSS Files and deleting et-cache File from visual Studio still doesn’t work.

Is Divi compatible with Local ?

It should be! Can you describe in a little more detail what isn’t working for you? It’s helpful to include screenshots of the issue along with any errors you encounter!

Hi Ben

I am also experiencing the same issue. I have disabled Static CSS File Generation however the images still won’t load. I made sure that I saved changes then closed and reopened a new tunnel in Live Link but it still doesn’t work. These images are PNG files saved at screen resolution that have been uploaded into the image module so nothing super technical. My SVG images load okay and the header image also loads okay.

Here is a screen shot:

Like most people, I have a client on the edge of their seat waiting to see the page I built :slight_smile:

cheers
Bren

It’s hard to know why those images are missing without knowing what the errors are. What errors are showing in the Browser Console when you view the site over the Live link?

You can open the browser console in Chrome by navigating to “More Tools > Developer Tools” and then clicking on the “Console” tab:

Other browsers will have similar ways of viewing the browser console.

When you view the console, what errors do you see?

Hi Ben

Thanks for getting back to me. Here is a screenshot of the error console:

rgrds
Bren

Not sure if it makes any difference but I do have Express VPN running.

A VPN might be causing issues. Those errors are basically SSL issues with the Browser blocking those assets as not being secure.

Because Live Links has to use HTTPS, I wonder if you need to update the Local site to use SSL and in the process update the URLs within the database to use the HTTPS version?

You might try that and see if that allows those images to be served.

Alternatively, if the clients are waiting on sign-off of these designs, you might consider pushing the site to a remote server so that they don’t need to wait for these SSL issues to be ironed out.

Hi Ben

Thanks for getting back to me.

I turned off VPN and some of the images loaded. Ironically the largest images loaded each at around 800kb but a bunch of other smaller images didn’t load.

I will look into the SSL issue but have set up a new staging domain for the client to view the page live.

cheers
Bren

1 Like

This topic was automatically closed 36 hours after the last reply. New replies are no longer allowed.