How to handle mixed-content errors with SSL
Why Isn’t my Site Secure?
If you’ve followed our instructions to add an SSL certificate to your site and redirected your site to use HTTPS URLs but you’re still not seeing a padlock alongside the address for your site, this will often be due to mixed-content errors.
Mixed content errors occur when a webpage loaded over HTTPS includes both HTTPS secured content and content loaded insecurely via HTTP.
This will cause most web browsers to display a warning or exclamation mark over the padlock icon in the web browser or show other warnings indicating that the page is not secure.
Changes to how web browsers handle mixed content in HTTPS pages may also result in the content being blocked completely when loading the page which could cause some page elements to fail to display or other errors with rendering the page in the browser.
Sites secured by an SSL certificate should load all page elements including images, scripts and other media via HTTPS so that the content is loaded securely. If your pages connect to any external sources to load these elements then the links to those sources should also use HTTPS.
Different Types of Mixed Content
Web browsers may treat different types of mixed content in different ways – images or media files are the most innocuous examples and will usually still be displayed even if loaded insecurely.
Other types of content like scripts, iframes and other ‘active content’ will usually be treated differently. Content may be blocked outright, or a more prominent warning notice may be displayed if this type of content is loaded insecurely:
Finding and correcting mixed-content
If you’re seeing mixed content warnings on pages within your site one method to locate the source of the warnings would be to open the page source for the affected pages within your web browser.
After opening the page source, you can use the search function or CTRL+F to search for: http://
This should help to identify any resources within the page being loaded via an insecure connection.
The steps to resolve any mixed content will depend on how your site is built. If you’ve coded the site yourself or used a web-design application it may just be a case of editing the affected pages and correcting the URLs for any insecure content by changing the URL from HTTP to HTTPS.
If you’ve built your site using a content-management-system then the steps to configure the site to use HTTPS may be different. You can start by editing any individual pages with mixed content warnings, checking for any links or other content inserted into pages, and correcting the URLs from HTTP to HTTPS. Check the documentation for the software used to build your site to see if there are any other steps for configuring the site to use an SSL certificate.
That’s it! You now have a better understanding to handle mixed content errors on your website.