Mixed Content. Something that will make your browser go “Nope!” Surely, you’ve seen something like that before. You get an email with a simple complaint from a client: “Why is my site saying it’s not secure?” At first, you brush it off because you set up an SSL certificate, didn’t you. But when you visited their WordPress site, your browser threw up a warning: “Your connection to this site is not fully secure.”
You clicked the padlock icon in the address bar, and there it was—mixed content. Some images, scripts, and stylesheets were still loading over HTTP instead of HTTPS.
Not good. Not only did this warning scare away visitors, but it also has potential SEO consequences. Google does not take security risks lightly.
How did this happen? And how can you make sure it never happens again? Let’s talk about Mixed Content.
What Is Mixed Content?
Mixed content is when a website served over HTTPS loads resources like images, scripts, or stylesheets over HTTP. This weakens security, as attackers can intercept unprotected elements, leading to compromised data integrity, and potential security vulnerabilities.
There are two main types of mixed content.
- The first is passive mixed content, which includes elements like images and videos. These do not directly impact the site’s functionality, but they still trigger security warnings in browsers, eroding visitor trust.
- The second type is active mixed content, which includes scripts, iframes, and stylesheets. These pose a greater security risk because they have the potential to be manipulated, leading to compromised site behavior or even malicious attacks.
You want neither.
Why Does Mixed Content Happen?
Even if your WordPress site has an SSL certificate, mixed content can still sneak in for a variety of reasons. One of the most common culprits is old hardcoded URLs within your theme files or plugins that still reference HTTP instead of HTTPS.
Sometimes, third-party scripts and services embed non-secure elements into your site, leading to an unexpected security warning. If your site was migrated from HTTP to HTTPS without updating all internal links, images, and scripts, this can also cause issues. And let’s not forget incorrect WordPress settings. If your site URL settings still reference HTTP, you are bound to run into problems.
Even something as simple as manually uploading content without checking if it uses the secure protocol can result in mixed content errors. It is easy to overlook, but once these issues stack up, they become a headache to track down and resolve.
How to Identify Mixed Content
Before you can fix mixed content, you need to find it. The simplest way is to use your browser’s Developer Tools. By opening the console (pressing F12 or right-clicking and selecting “Inspect”), you can see mixed content warnings flagged in real time. This gives you a clear indication of which resources are problematic.
Another way to detect mixed content is by using an online scanner. Tools like Why No Padlock, SSL Labs’ SSL Test can quickly analyze your site and point out any non-secure elements that need to be addressed.
Fixing Mixed Content Issues
Once you have identified the problem areas, the next step is fixing them. The first thing you should check is your WordPress settings. Navigate to the General Settings page, and make sure that both the WordPress Address (URL) and Site Address (URL) fields are using a URL that starts with https://, not http://.
If they are not, updating those two values will resolve a large portion of mixed content issues. And it’s as easy as changing that URL to the https:// version and hit Save Changes.
The next most common thing you’ll need to do is fix URLs in your database. You see, if your problem lies within an old HTTP URLs scattered across your site, a database-wide replacement is the only thing that will fix that.
Those old HTTP URLs could be leftover from when your site was running under HTTP, for instance. A plugin like Better Search Replace is designed to help with this, allowing you to swap out all HTTP references with HTTPS in one go.
Note: make sure you back up your database before you change things in your database with this plugin.
For those still facing issues, enabling automatic HTTPS rewrites is another option. Some plugins like Really Simple SSL offer this functionality, ensuring that any lingering HTTP requests are redirected to HTTPS before they cause a problem.
When you end up having to use a plugin like this, this generally means your theme or plugin have a HTTP version of an internal URL to an asset, for instance. You may need to manually update theme files or plugin configurations that contain hardcoded HTTP URLs.
External scripts (from plugins) can be trickier to manage. If a third-party service still loads over HTTP, you have limited options. You can reach out to the provider and ask if they support HTTPS, or find an alternative secure service to replace it. If neither option is possible, then consider whether you truly need that external resource on your site.
The Problem with Really Simple SSL
Many site owners turn to Really Simple SSL as a quick fix for mixed content issues. While it can be useful for enforcing HTTPS across your site, it comes at a cost. Plugins like this work by dynamically rewriting insecure URLs on every single page load, adding overhead to your site’s performance.
You should always want to resolve mixed content at the root. You know, instead of relying on a plugin to fix what is essentially a deeper problem.
The right approach is to update all URLs directly in the database, theme files, and plugins. This ensures that your site is clean, fast, and not dependent on unnecessary processing. Solving mixed content issues at the source is always the better long-term strategy.
Preventing Mixed Content Issues
Once you’ve fixed your mixed content issues, it is still quite easy to create to end up with the same issues. And, we all know prevention is always better than cure, so here are a few steps you can take to avoid mixed content problems from the start:
- Always make sure that all resources you add to your site use HTTPS.
- When embedding third-party resources, verify that the service supports HTTPS before integrating it.
- Regularly audit your website and scan for mixed content issues before they become a problem.
- Only use
https://versions of URLs.
Regularly scanning your site for security issues can also help catch mixed content early before it becomes a larger issue. Making it a habit to review new content, plugins, and scripts before they go live will save you time and prevent security warnings from appearing in the first place.
Leave a Reply