What is a mixed content warning?
These messages occur when a website, which has an SSL enabled, contains elements that are still loaded over the HTTP connection (it can be seen from your browser console):
How to fix a mixed content warning?
If you have a website, built with one of the popular CMS, we have prepared detailed guides for you:
- How to fix mixed content error in WordPress?
- How to fix mixed content error in Joomla?
- How to fix mixed content error in Magento?
- How to fix mixed content error in OpenCart?
- How to fix mixed content error in PrestaShop?
If your CMS is not in the list, or you have a custom-coded website please proceed with the steps below:
Step 1 - Check configuration files and page’s source code file
If your website has a configuration file, start checking from it - there is a high possibility that your website’s URLs (or default content URLs) are added there with HTTP protocol mentioned:
In such a case, you will only need to replace http with https.
Step 2 - Check page’s source code file
If you are a website developer, and the mixed content issue is visible on specific pages only, make sure to open the file of those pages in File Manager and search by “http://”. Most likely, you will find the content in question and be able to easily replace HTTP with HTTPS.
Before replacing, make sure that the content is available via HTTPS. Just open the URL in question and change HTTP to HTTPS in the URL bar.
- If the content is available - change the URL in the file without worries
- If the content is not available, you can either replace it with the same or similar content from another source (which is available by HTTPS) or host that content to your website. The other option would be to exclude that content
A huge help for you in detecting which pages have mixed content issues would be the Why No Padlock website.
Step 3 - Add a redirect rule to .htaccess
If the first two steps didn’t help you, you can also open your public_html/.htaccess file (or create it if it wasn’t created yet) and insert the code below:
Header always set Content-Security-Policy: upgrade-insecure-requests
Save the changes and reload your website - it should already be working fully secured 💪
- This option is not recommended if your website uses symlinks