Today, running a website requires a secure connection between you and your users. This connection is made via an SSL certificate, and it is actually quite easy (and free) to install on your site. Most hosting companies offer free Let’s Encrypt certificates and renewals that can be installed with a few clicks. Installation is not the final step, however. However, mixed content is a common problem when setting up SSL, and it’s not a big deal. We can show you how to easily fix the mixed content error in WordPress and fully secure your site.
What is the mixed content error in WordPress?
Essentially, the mixed content error occurs when your WordPress site provides some resources securely over HTTPS and others insecurely over HTTP. Sometimes, parts of this mixed content don’t even appear, making your site look broken in many ways. This is obviously bad for several reasons.
The first is that Google penalizes any site it deems insecure, warning users who click on the site that it could be harboring a number of Internet evils. Chrome users will get a double dose of this warning, as the browser itself flags potentially dangerous sites.
Then, Google and other search engines will penalize your site in the rankings, both for being unsafe and possibly containing malware, but also for having a poor user experience and for not loading content.
Add to that the fact that mixed content errors on WordPress sites can have a huge impact on load times, and you have a trifecta of reasons why users and search engines will avoid your site like the plague. Because in their eyes, your site looks or feels like the plague.
So how do you prevent this from happening and your site from becoming a pariah in the eyes of Google?
How to fix the mixed content error in WordPress with a plugin
It is actually relatively simple to fix a mixed content error in WordPress. Because of the platform’s customizability and flexibility, almost any problem you may encounter has been solved by a plugin developer. You just need to know where to look. For most sites, being able to quickly install and configure a plugin is the best solution.
We recommend checking out WebAware’s SSL Insecure Content Fixer. The simple installation and activation of this plugin can potentially fix any mixed content errors that appear on your WordPress site. It handles, as the WordPress.org plugin description says, “some basic fixes on your website using the simple fix level.” If you need more than that, the plugin has a more advanced settings page where you can adjust what needs to be secured.
You can find the settings under Settings – SSL Insecure Content in your WP admin panel menu. Note that the Simple
selection is already enabled.
Most of the time, this works. To make sure it works, we highly recommend running a page speed test on GT Metrix or Pingdom. While these tests are fantastic in themselves for helping identify errors on your site, they both flag insecure/mixed content. So if something is wrong, one of them will tell you.
We’ve had good luck using this plugin to fix errors using everything but Capture All. In our experience, AJAX calls that are automatically fixed tend to break the functionality of the site. However, each of the other options fixed everything that GT Metrix or Pingdom found.
The biggest problem with using a plugin like SSL Insecure Content Fixer is that if you disable the plugin, there is a chance that mixed content fixes will also be disabled. If this is a potential problem for you, we have a solution for that, too.
How to manually fix the mixed content error in WordPress
WordPress, like any other major web application, is really just a database on a server. If the resources in that database are still marked as HTTP and browsers are asking for HTTPS… that’s a mixed content error. Fortunately, there are some fairly simple solutions that you can also apply manually.
Search and replace in your WP database
While this also involves a plugin, it’s only the actual functionality and can be disabled afterwards. Find the Better Search Replace plugin on the WP.org repository.
Under Tools – Better Search and Replace, you will search for unsecured instances of your domain name and replace them with HTTPS versions. Simply enter http://yourdomain.com and https://yourdomain.com in the Search/Replace with ( 2) fields.
Next, choose the database tables you want to include in the search. Usually, this is all tables. So click on the top, scroll to the bottom and shift click on the last table. This will highlight all the tables in the list (3).
We suggest that you enable the Run as Dry Run option. This way the plugin will perform all the actions, but will not actually save the changes. It will report on everything it finds.
If you like what you see, uncheck the blank test box and run it for real. Before you do, however, we strongly suggest that you back up your site and database. Whenever you plan to touch your database, back it up. A corrupted or poorly managed database is one of the hardest things to fix in any WordPress.
You can also perform this same process via phpMyAdmin in your hosting dashboard, but it doesn’t have the idle function and requires much more technical knowledge to implement. So we suggest the plugin method for most people.
Editing the .htaccess file
Your website’s .htaccess file is responsible for directing traffic and allowing access to elements of your site. You can enforce HTTPS on your site’s resources by adding a few lines to your .htaccess file using FileZilla (or another FTP client) or your host’s dashboard file manager.
Basically, you’ll be setting up redirects using .htaccess, so that your existing content doesn’t continue to be loaded via HTTP.
To do this, go to the /public_html directory or the root directory and find the .htaccess file it contains. Right-click on it and choose the option that allows you to edit the file, which will open the file using your default text editor if you are using FTP or a built-in editor if you are using your host’s dashboard.
Inside, you will pass the following code between the final tag and the line that says # END WordPress.
RewriteEngine On
RewriteCond %{SERVER_PORT} !^443
#13 ;
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
RewriteBase /
RewriteRule ^index.php$ – [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-f !-d
Here’s another tip. Download a backup of the current .htaccess file, in case these changes make something go wrong.
If everything works as expected, you should no longer see the mixed content error. However, you may still encounter this error if you are using a caching plugin. If this is the case, clear your website’s cache and try loading it again.
Conclusion
If you or your users encounter the mixed content error in WordPress, it’s not as scary as it sounds. In fact, it’s one of the easiest WordPress error messages to fix. Whether you prefer to fix plugins or dig into the core WordPress files, it is simple, quick and easy to get rid of the mixed content error on your site.
What have been your experiences with mixed content errors?
