Are you seeing the mixed content error in WordPress? Mixed content error in WordPress is caused by incorrect HTTPs/SSL settings. Often times it doesn’t affect your website’s functionality, but it can have adverse affects on your website’s SEO and user experience. In this article, we will show you how to fix the mixed content error in WordPress.
What is Mixed Content Error in WordPress?
It is highly recommended to add HTTPS / SSL in WordPress because after July 2018 Google Chrome will mark all http versions of website as insecure.
SSL adds an additional security layer around data transferred from your website to users’ browsers. Search engines like Google recommend using SSL on your website as well.
All best WordPress hosting companies are now offering free SSL as part of their packages. If your hosting company doesn’t offer that, then you can get free SSL through Let’s Encrypt for your WordPress site.
If you have correctly implemented SSL on your website, then you will see a green padlock icon next to your website’s URL in the browser address bar.
On the other hand if your HTTPs/SSL settings are not properly setup, then you will see an info sign or a broken padlock icon in the address bar.
This indicates that while your website is using a SSL certificate, some content on your website is still served from non HTTPS urls.
You can find out which content is served through insecure protocol by using the Inspect tool. The mixed content error will be displayed as a warning in the console with details for each mixed content item.
If it is just a single item that you can manually fix, then you can go ahead and fix it by editing the post, page, or theme file where it appears.
However, in most cases these items are added dynamically by WordPress or stored in your database. In that case, it will be hard to detect all of them and fix them manually.
That being said, let’s take a look at how to easily fix the mixed content error in WordPress.
Fixing Mixed Content Error in WordPress
First thing you need to do is install and activate the SSL Insecure Content Fixer plugin. For more details, see our step by step guide on how to install a WordPress plugin.
Upon activation, you need to visit Settings » SSL Insecure Content page to configure the plugin settings.
This plugin provides different levels of fixes to the mixed content error. We will explain each one of them, what they do, and which one is best for you.
1. Simple
This is the fastest and recommended method for all beginner users. It automatically fixes the mixed content error in WordPress for scripts, stylesheets, and WordPress media library images.
2. Content
If the simple method doesn’t fix the mixed content error on your website, then you should try this method. It will use all the features of simple, in addition to checks for fixes inside WordPress content and text widgets.
3. Widgets
This includes all fixes applied in content level plus an additional fix to resources loaded in all WordPress widgets on your website.
4. Capture
This method captures everything on every page of your website from header to footer and replaces all URLs with HTTPs. It is slower and would affect performance of your website.
5. Capture all
When all above levels fail, then you can try this method. It attempts to fix everything which may result in some unexpected behavior on your website. It will also have the most negative impact on performance.
After selecting a content fix level, you need to scroll down to the HTTPS detection section. This is where you can choose how to detect the HTTPs content on your website.
The default option is to use a WordPress function, which would work for most website.
Below that you will find other options which are particularly useful if you’re using Cloudflare CDN, nginx web server, and more. Go ahead and select the method that you think applies to your website depending on your particular setup.
Don’t forget to click on the save changes button to store your settings.
You can now visit your website to see if this resolved the insecure content issues on your website. Make sure to clear your WordPress cache before checking your website.
If the mixed content error in WordPress is not fixed, then revisit the plugin’s settings page and readjust the fix levels.
We hope this article helped you learn how to fix the mixed content error in WordPress. You may also want to see our list of the most common WordPress errors and how to fix them.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Hi, Great article. It works for me but only Capture all option.
Thanks
Thanks for sharing the option that worked for you
What happens when you want to display insecure links on your secure site but the SSL certificate is preventing them from showing?
I want to include links to California’s Caltrans traffic cams on my site but since they’re insecure, they show up on the backend. No mixed content warnings, it just won’t show them on the front end.
I can’t just call the state of California and tell them to add security to their traffic cam links, so is there any fix for this?
You could use a URL shortener such as Bitly to link to the HTTP link through an HTTPS shortened link
The plugin didn’t work with simple option but did with content option. How do I identify and fix the files or should I just leave as is? If so, does the plugin cause slower loading times?
You could leave the plugin active or you could use the tool in our article here:https://www.wpbeginner.com/plugins/search-and-replace-plugin-for-wordpress-database/
to go through your content to manually edit the files for forcing them to be https. If you disable the plugin, your site will revert to the mixed content.
I used search and replace plugin. It fixed my problem temporarily but i see the issue again after a few minutes. I dont understand why. can you suggest?
You may want to check the caching on your site from plugins and your host to ensure it didn’t cache the mixed version.
Thanks,
It solved my mixed content problem when I have selected the
setting “Capture” in the SSL Insecure Content plugin. So do
I leave it as it is or do I change it back to simple.
Regards
You would go back to the default once you fixed the files that were causing the issue.
thank you very very much the plugin method worked for me thanks once again.
Glad our guide could help
Make sure that you replace your URL from http://www.example.com to https://www.example.com in wordpress general settings.
If you are using elementor, go to elementor-tools-replace URL and replace with HTTPS.
This article is for sites already set to HTTPS but to clarify before someone changes those settings they would want to have an active SSL certificate as we explain in: https://www.wpbeginner.com/wp-tutorials/how-to-add-ssl-and-https-in-wordpress/
thank you very very much the plugin method worked for me thanks once again.
Hey, I switched to https with the plug in downloaded the plug Really Simple SSL and have issues with Mixed content. I’ve downloaded the plug in as indicated and have ended trying all the available options up until capture all, but I’m afraid that it is not working. Any ideas why, or any possible solutions? Thank you.
Good article and thanks for the plugin recommendation.
Great article, it helped me fix our mixed content issue. Recently we switched our WordPress site to https. I had to use the plugin on “Capture” level before our mixed content errors got fixed. Is that the end of the issue? Or do I need to research and fix the underlying issues that created the mixed content problem in the first place?
Thanks again for a very useful article.
Why have you deleted my comment?
hi
thank you for this useful post. why wpbeiginner doesn’t use https/ssl ???
I pointed that out after yours and they deleted it as they can’t answer that question.
They also have mix content issues and won’t fix them…..why?