Fixing the Mixed Content Warning on SSL-Enabled Websites
Please use the “Print” function at the bottom of the page to create a PDF.
For IONOS-Managed SSL Certificates
In this article, we will show you how to recognize and remove mixed content and activate encryption for all content on your website.
If your website does not completely protect the content, a Mixed Content Warning appears in the browser. A completely encrypted delivery of all website contents through HTTPS can be recognized in the address line of the browser by the green lock.
What is mixed content?
Mixed content is created when a website that is accessed encrypted through HTTPS delivers content partially unencrypted through HTTP. Typical examples for mixed content are images, audio and video files, iFrames, CSS and JavaScript files and objects.
There are two types of mixed content
- Mixed passive content: Web content that other parts of a website cannot change but can simply be delivered. These include images, videos, audio files, and object sub-resources embedded in a website.
- Mixed active content: Web content that is part of a Web site's Document Objects Model (DOM). These web contents can permanently change parts of a website and its behaviour. These include links, scripts (such as JavaScript), XML http request objects, iFrames, CSS files that work with URLs, and object data attributes.
Please note: If you are using WordPress Standard or a IONOS WordPress hosting plan, please follow the instructions in the IONOS Community.
Remove and replace mixed content
The best way to avoid mixed content problems is to offer all content over HTTPS instead of HTTP. That's how it works:
Step 1
Use the online tool Why No Padlock to check which content on your website triggers the mixed content warning.
Step 2
Replace all paths starting with http:// with https://.
Depending on the content management system used, it is sufficient to adjust the website path in the configuration file of the system. If absolute paths are stored in the database, it is necessary to adjust them directly in the database. Please make a database backup in advance. Some CMS platforms offer plugins for this purpose. Check the manufacturer's site to see if there is a plugin available.
Step 3
If the links belonging to the website have been switched from HTTP to HTTPS, you should set up a permanent 301 redirect. A 301 Redirect is a server-side, permanent redirect that informs the Google search engine that the requested content has moved permanently.
Add the following lines to the .htaccess file:
# Example RewriteRule:
#
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{SERVER_PORT} 80
RewriteRule ^(.*)$ https://www.your-domainname.com/$1 [R,L]
</IfModule>
Step 4
Theoretically, the HTTP and HTTPS variants are two different websites. You should also register the HTTPS variant in the webmaster tool after the conversion.
If your browser continues to display the mixed content warning, it may be due to image, iFrame content, CSS and JavaScript files from external sites that are simply not offered via HTTPS. Unfortunately, there are no general steps for troubleshooting at this point.