What is "mixed content"?
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 <img src="//external.com/resource.jpg">) either come from the same host (e.g. domain.com), thus using the same certificate or come from an external host (external.com) 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.
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:
To fix mixed content errors and get the green lock icon, you need to:
1. Check that the resources specified in the mixed content warnings load properly over HTTPS on their own.
2. 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.
3. Change every instance of
After issues with mixed content are fixed, browsers will display the green lock icon in the address bar.
Below are some additional resources specific to Wordpress sites: