Frontend not showing my design. What am I doing wrong?

It’s the little things that drive me mad. I started to design the heading section of my website. It all looks good in the editor and in preview. But when looking at the frontend, there’s none of it.

Here’s what it looks like in the editor (and in preview) so far:

And this is what I get on the frontend live site link:

I tried the same using the Local App before, and it worked, hence I decided to give it online a try.

What am I doing wrong?

Right, I know what I had to change to make it work, though I don’t know why.

In firefox, when inspecting the code, the console gave me a lot of errors concerning css stylesheets:

.

I had external stylesheets enabled as loading method in the performance settings. After setting that back to inline, it works. No errors on the console (other than a missing favicon…).

Is that the normal behaviour, or a bug?

I’d guess that your site is https but the style sheets are being loaded via http which is causing the mixed content message. So the browser will block the http stuff for security reasons.

1 Like

Thanks for your reply, @simon. A clear yes to the first. Any idea how I can dissolve that issue?

I tried putting the https address to one of your external CSS files into my browser and it returned the contents fine so they can be served over https. I also ran your home page through the site ‘Why no padlock’ to check for mixed content and none was reported. I can see that you are using Lets Encrypt for the SSL certificate and that the web server is forcing SSL so it should be OK.

When you installed wordpress, did you have an SSL certificate for your domain already existing (and then installed wordpress for https) or did you convert to https later? I know that converting to https afterwards can cause issues like this with incorrect paths in the Wordpress database.

It might be worthwhile initially trying external files again and then using the Regenerate CSS function in Bricks and seeing what happens. If that doesn’t work I’m not sure what to suggest as I’m no expert. I use Let’s Encrypt and external files and don’t have this issue so external files do work (sorry!). You could try a search and replace plugin to look for http:// path in the database.

1 Like

Thanks Simon. I’m a WP noob and did the install via a 1-click install that my Webhosting offers. I do have SSL certificates on my domains and subdomains. Comes with the package. I expected that everything else would work automatically. Seems it doesn’t. I’ll try your suggestion.

Cheers,
Fynn