What is “mixed content”?
What does the green lock mean?
If your site loaded all resources securely over HTTPS, a client would see a green lock in their browser address bar:
This is a good indication because your site has a working SSL certificate and all resources loaded by the site are loaded over HTTPS. Resources (i.e., in HTML
that also provides a valid certificate.
The green lock is there to assure users that their connection is safe. Loading all resources over HTTPS can help with user experience and protects a site from attacks.
How do I know if my site has mixed content?
Below are indications in the web browser that insecure or mixed content is present for the site requested:
If it’s just a warning, the page will load the resources but users do not see the green lock and see a warning for Mixed Content as shown below:
If the page is blocked, then the browser refuses to load the resource over an unsecured connection:
How can I fix a mixed content issue?
To fix mixed content errors and get the green lock icon, you need to:
Check that the resources specified in the mixed content warnings load properly over HTTPS on their own.
Copy the URL of the resource in your browser and make sure a https:// is in front. If the resource is unable to load properly this means that it is not from the same host as your zone (thus, does not have a supported SSL certificate) and you have a few options:
- Use the resource from a different host that supports HTTPS.
- If allowed, serve the resource directly from your host instead.
- Remove the resource from your site.
After issues with mixed content are fixed, browsers will display the green lock icon in the address bar.
If you host a WordPress site
Below are some additional resources specific to Wordpress sites:
Flexible SSL & WordPress: Fixing “Mixed Content” Errors
Plugin – SSL Insecure Content Fixer
Plugin – Really Simple SSL