1

I have a WordPress which is based on the Genesis Framework and uses CloudFlare Flex SSL. The problem occurs in iOS Safari and Firefox mainly, the site gets loaded but without styles and everything else, I believe this is a Mixed Content issue.

Normally the site should look like this: enter image description here

Loading without resources: enter image description here

Firebug: Firebug

2

Newer versions of Firefox and Safari block resources such as CSS files when they detect mixed content, what this means is that you have essential resources such as CSS and JS files being blocked by the browser, why? because your site is not 'secure as much as it could be', you have some resources loading under HTTPS and some HTTP.

To resolve the issue is rather simple, make sure your files are being loaded from SSL. A simple fix would be to use //www.example.com/style.css and leave out both HTTPS/HTTP. The browser will then fetch the resources from whatever the visitor is visiting from.

In the event that you are using a WordPress plugin to rewrite the URL paths of HTTP to HTTPS, then I recommend that you remove the plugin and edit the template files manually, not only is it more reliable, its more secure (not having to do regular updates) and your save WP processing time.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.