Frequently Asked Question

Why isn't my Site's Padlock green or is giving out a Warning ? (Mixed Content Error)
Last Updated 2 years ago

image

Having an SSL certificate in your website has become in recent time crucial not only because an encrypted traffic help protecting users' private data but also provide confidence to your visitors.

Also, the majority of browsers (if not all) are pushing more and more to the adoption of these protocols, showing warnings to the web surfers which can expel users.

An SSL certificate well-implemented will definitely help for the positioning of our website in the different search engines SEO optimization. However, when integrating an SSL or migrating from HTTP to HTTPS, website owners may encounter several problems. One of them the so called "mixed content".

Understanding the issue

HTTP is a system whose purpose is to exchange information between servers and clients. In most cases when you don’t use HTTPS but HTTP, the connection is technically open to hacks like “man-in-the-middle attacks”. And this is normal in the case your website doesn’t transmit sensitive information thus not need to be secured.

A mixed content shows out when the site that a user is trying to load serves HTTPS and HTTP content at the same time. Precisely this is the core- as HTTP and HTTPS protocols are utterly separate. In such a case, when you have an HTTPS that includes HTTP content on it, the HTTP portion is potentially vulnerable as the same can be altered by hackers even if the main page of your website is served via HTTPS.

And this is the well-known "mixed content”. The page you are calling is partially encrypted and despite the fact that it shows out as secure, it isn't.

Therefore, when redirecting all your traffic site to HTTPS, make sure everything does go through that protocol (images, JavaScript files, etc) Else, the risks are high since any cybercriminal can supplant the HTTP links on your website with the only intent to steal your credentials details, take control of your account, private information and install malware on your computer.


What Causes Mixed Content Warnings?

From our experience, mixed content happens right after a site is migrated from HTTP to HTTPS (SSL certificate installed). So some images, links, scripts or CSS files in our website are simply transferred but not configured to serve via HTTPS.


Here are some additional causes of this warning:

  • New plugin/theme added to your site using absolute paths i.e. http://domain.com/style.css to link to CSS and JavaScript, instead of using relative paths (/style.css).
  • You have embedded video scripts using HTTP instead of HTTPS.
  • Links to external scripts included inCSS and JS files that do not have HTTPS enabled
  • Your images have encoded URLs (such as http:// domain.com/image.png) that run over HTTP. These may be within posts, pages or even widgets.

Beware there are two main types of mixed content: active and passive. The active mixed content is when web pages are loaded through secure HTTPS connections but contain scripts that load over HTTP as well. On the other hand, passive mixed content happens when an image, video or audio files are uploaded through HTTP.

How to check if my website has mixed content?

Identifying it is rather simple, most modern browsers include a developer section where you can find a developer console.

The image below refers to a URL created especially for this example, as you can see the browser shows a question mark instead of the green padlock.

To check in your browser please right-click go to Inspect Element > Web Console for this example the result is:

image


Conclusion

Mixed content warnings can be frustrating to deal with, especially when there are a handful of causes to which they can be attributed. In most cases, a simple search and replace should quickly resolve it and get your site back to normal in just a few minutes. If that doesn't fix everything, it's likely that one or two coded scripts remain. You'll either have to find them and update them manually to get rid of this bug or simply contact us and hire one of our developer who can go through all of that for you.


image


Please Wait!

Please wait... it will take a second!