Fixing Mixed Content Warnings on Your HTTPS Website
After installing an SSL certificate and switching your site to HTTPS, you may notice that your browser still shows a "Not Secure" warning or that the padlock icon is missing. This usually means your page is loading some resources (images, scripts, stylesheets) over HTTP instead of HTTPS. This is called mixed content.
How to Identify Mixed Content
Open your website in Chrome, right-click anywhere on the page, and select Inspect. Click the Console tab. Any mixed content warnings will appear as yellow or red messages that say "Mixed Content: The page was loaded over HTTPS, but requested an insecure resource." The message will include the URL of the offending file.
Common Causes and Fixes
1. Hardcoded HTTP URLs in your content
If you have images or links in your posts, pages, or widgets that use http:// instead of https://, they will trigger mixed content warnings. For WordPress, use the Better Search Replace plugin to find all instances of http://yourdomain.com and replace them with https://yourdomain.com across your database.
2. Theme or plugin loading HTTP resources
Some older themes or plugins may load external scripts, fonts, or images using HTTP. Update your themes and plugins to the latest versions. If the issue persists, check the theme settings for any URLs you can change to HTTPS, or contact the theme developer.
3. External resources loaded over HTTP
If your site loads images, scripts, or widgets from external websites using HTTP, you need to change those URLs to HTTPS. Most reputable services (Google Fonts, jQuery CDN, analytics scripts) support HTTPS. If an external resource does not support HTTPS, consider hosting a copy of it on your own server.
4. WordPress Site URL not updated
In WordPress, go to Settings > General and make sure both the WordPress Address (URL) and Site Address (URL) use https://. If they still show http://, update them and save.
Quick Fix: Force HTTPS for All Resources
As a stopgap, you can add this to your .htaccess file to force all HTTP requests to HTTPS:
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule .* https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
This fixes requests to your own domain but will not fix external resources loaded from other domains over HTTP.
For WordPress specifically, the Really Simple SSL plugin can automatically detect and fix most mixed content issues. Install it, activate it, and it handles the heavy lifting.
