Are you trying to switch from HTTP to HTTPS, but your WordPress still has mixed content error even after trying everything on the internet?
I can understand your frustration.At One Smart Sheep, we get clients like you who face WordPress issues and waste hundreds of dollars. We give them an extremely affordable solution.Did you know that mixed content warning can affect your site’s SEO performance negatively?Google announced in 2014 that HTTPS would be a ranking factor, and the mixed content warning is the biggest culprit that doesn’t let you take full advantage of HTTPS security.
Not only does it harm your website on Google, but users see your site as suspicious—not visiting your site ever again.To address the issue, Google has made HTTPS a ranking factor so that webmasters focus on fixing the issue, and hackers cannot steal users’ confidential information from their websites.In this article, you'll learn:
- What Is Mixed Content Error in WordPress?
- Examples of Mixed Content Error
- What Triggers Mixed Content Error?
- How to Check Checking HTTPS Warnings in Bulk?
- How to Fix Mixed Content Error Without a Plugin?
- How to Fix Mixed Content Error with a Plugin?
- Why Not to Use Really Simple SSL Plugin?
- Is Cloudflare Effective to Fix Mixed Content?
- Is 'Better Search and Replace' Safe?
- Chrome No Mixed Content Warnings Examples
What Is Mixed Content Error in WordPress?
As the name suggests, the mixed content error is when scripts load over HTTP and HTTPS simultaneously, and a warning appears in the address bar of the user's browser. Images, JS, and CSS are script files that load when visiting a website. Even a single file that loads over HTTP can cause a mixed content error in WordPress.
Examples of Mixed Content Error in Different Browsers
Here are the examples you can see how the mixed content errors look like in different browsers:
1. Google Chrome Mixed Content Error Example
According to Statcounter, Google Chrome has a whopping 66% market share.
Google Chrome started to show Not Secure in all the latest Google Chrome versions across all operating systems. See the below screenshot here is how Chrome shows mixed content error. Google Chrome warns, "Your connection to this site is not secure"
2. Firefox Chrome Mixed Content Error Example
Firebox has a market share of only 4%. Most people love to use it since its memory consumption is a lot lower than on Chrome. Firefox is more descriptive when it comes to showing mixed content warnings.
3. Opera Chrome Mixed Content Error Example
Opera dominates only 2% of the browser market. Opera isn’t as dangerous as Chrome since Chrome shows users the site is not secure without clicking the padlock.
4. Edge Mixed Content Error Example
Microsoft is putting real efforts to make Edge better and adopting technologies that have made Google Chrome a hit. Now Edge runs on the Chromium engine, but Microsoft engineers have customized it to look different. Edge shows exactly like Chrome but with different styles, fonts, and icons.
What Triggers Mixed Content Error?
Several reasons cause mixed content errors, but I've listed five common reasons:
1. Incorrect WordPress URL Addresses
Most users forget to put HTTPS in WordPress Address (URL) and Site Address (URL) from the General section that falls under Settings, especially when they install a new WordPress instance.
Most of the time, merely putting HTTPS in the URLs fixes the problem without any plugins and external support from your hosting.
2. Installing WordPress from cPanel as HTTP
Most users install WordPress as HTTP since cPanel shows a warning that the respective domain doesn’t have an SSL certificate.
I strongly recommend to install your blog as HTTPS and install SSL certificates immediately after creating your blog.But if your hosting provider offers a free Let's Encrypt certificate, you don’t need to worry about installing the SSL certificate,.
3. Using Outdated or Nulled Theme
Users download nulled themes from the internet, and many scripts are served over HTTP connections so that hackers can steal the content. Most nulled themes have malware that mostly servers over HTTP connections.
Most outdated themes were not built with SSL security in mind, so they frequently cause mixed content errors.It’s better to audit the WordPress theme before you hit the purchase button.
4. Importing Demo Content
Importing demo content is one of the most common reasons before the mixed content warning.Demo content, usually written in XML, is the file that helps your WordPress blog exactly like the demo.
It has links served over HTTP, and WordPress catches the insecure HTTP links embedded in the demo XML file.Keep reading; we’ve provided a quick solution to this problem.
5. Hosting Limitations
Users fall victim to cheap hosting providers who don’t mention SSL availability until they buy the package.They take full advantage of the people’s ignorance since people don’t have any idea about SSL unless they see the insecure padlock icon.Later on, hosting companies force to use a premium package to use the SSL certificate.
Godaddy provides a free SSL certificate to people who opt for the Ultimate package that costs $13 a month.
How to Check Checking HTTPS Warnings in Bulk
Do you think you have fixed the mixed content warnings from your homepage and you’ve successfully passed the mission?Nope.Your website may have other scripts that might be loading over the HTTP protocol.I suggest checking your whole site for HTTP insecure content.You might be thinking about how to check?
Method 1: Ahrefs Free Webmaster for SEO
Ahefs just made their premium SEO audit tool for free to all webmasters.
It crawls your whole website and finds out all the technical SEO issues on your website.To find all the URLs being served over HTTP, go to Page Explorer and click Filter and choose HTTP protocol.
Method 2: Screaming Frog
Screaming Frog has been the industry leader in detecting SEO technical issues, including mixed content issues.The free software is limited to 500 pages only, but it’s enough to find out the culprit.How to get started?Download Screaming Frog from the official website.Put your website and click scan.
Once completed, you’ll find out all the HTTP requests under the Security section.It’s simple, isn't it?
Method 3: Google Advanced Command
The fastest way to find HTTP web pages from your website is to use Google advanced command.The command runs:site:yourwebsite.com -inurl:https
We’ve optimized our website well so that's why you’ll not find mixed content issues on our website.I recently found out using Google advanced operator that Amazon has several URLs that are still served over HTTPsite:amazon.com -inurl:https
Even the biggest company in the world can make mistakes :D
Check SSL Certificate Before You Try to Fix Mixed Content Issue
When you install a new WordPress instance, it’s highly likely that you see the red padlock.If your hosting company provides free Let’s Encrypt certificates, it’ll take a few minutes until it’s fully activated.You can use different tools that can show either SSL is properly installed on your website or not.Visit whynopadlock.com and check your SSL certificate status.
It’s crucial otherwise fixing mixed content and insecure connections wouldn’t fix the issue.You can install Cloudflare or Let’s Encrypt that provides free SSL.If an SSL certificate is not installed, you’ll get an error message.Dlg_flags_sec_cert_cn_invalid
How to Fix Mixed Content Error with a Plugin
I strongly recommend fixing the mixed content warning without a plugin.But if you’re a newbie to WordPress, you can use the Really Simple SSL plugin that is the best for fixing the mixed content problems.Install the plugin and activate it.
When you hit the activity button, you’ll be redirected to this page.
Let me explain the three points:
- The CSS and JS files are to be changed from HTTP:// to //. If you’re a complete beginner, ignore it.
- Some images and other scripts may be serving from HTTP servers where the SSL certificate is not installed. It’s recommended to remove these files or install SSL from other servers. It happens with a demo theme that imports files from the servers with no SSL certificates.
- Making a backup is essential.
Click Go Ahead and activate SSL.You’re done.Your mixed content warning will disappear. If it doesn’t, try the manual method.
How to Make a Backup of My WordPress Blog?
Go to cPanel, and find WordPress that falls under the Scripts section.
Scroll down to the Current Installations section, and click the Backup Icon.
Select Backup Directory, Backup Database, and select the Default Backup option.
And click Backup Installation.
How to recover? Easy. Click the Backup & Restore icon. You can recover any backup instantly or download to your machine.
How to Fix Mixed Content Error without a Plugin
Sometimes even if you install and activate a Really Simple SSL plugin, your site may not be fully secure. Here are a few ways you can fix:
Way 1 - String Locator and cPanel Editor
You can fix the issues with the String Locator plugin that you can delete later on once you’ve fixed the issue, unlike Really Simple SSL that reset the settings.Check out the below site even with Really Simple SSL installed; still, it has mixed content issues.
The reason? The URL doesn’t have an SSL certificate installed since it's hosted on every hosting. It doesn’t work with https.How can you fix it?First, I need to find the location of the URL in my WordPress directory so that I can replace it.You can use String Locator to find out the URL.
Go to Tools and select String Locator. Paste the URL that has a mixed content issue by going to inspect elements.
Click Edit.It will redirect you to this complex page. You can make changes here, but sometimes you may not edit properly.
It prefers to edit with a cPanel editor since you can’t edit it here if it’s a complicated file.We first need to find the file location.
Go to File Manager.
Go to the desired folder and edit the file.
Press Ctrl+F (Control+F in Mac) and paste the URL that is loading in HTTP.
Either you can remove it or replace it with the HTTPS version. Upload a file on your blog via Media Library and paste the URL here.
Copy the URL shown on the right side.
Replace the URL and paste into the url("YOUR COPIED URL HERE") and save changes.As you can see, there are no mixed content issues.
Way 2 - .htaccess Method
.htaccess is a highly recommended method that should be used since it works on the server-side that makes the site load faster.You need to go to File Manager in cPanel.
.htaccess doesn’t show up as it’s hidden as default. Click Settings and enable SHOW HIDDEN FILES.
Refresh the page, and right-click .htaccess and Edit.
You don’t need to do anything, just click Edit.
And paste the below code into the file and hit Save Changes.
RewriteEngine OnRewriteCond %{SERVER_PORT} 80RewriteRule ^(.*)$ https://www.website.com/$1 [R,L]Don’t forget to change your website name.Here is how we’ve done for our website:RewriteEngine OnRewriteCond %{SERVER_PORT} 80RewriteRule ^(.*)$ https://onesmartsheep.com/$1 [R,L]
Why Not Use the Really Simple SSL Plugin?
Most people recommend using the Really Simple SSL plugin to solve all SSL and HTTPS problems.But it’s not the right way, according to many experts.Many hosting providers have banned the plugin since it consumes a lot of CPU time and causes the site to shut down.
It’s the reason when you deactivate Really Simple SSL; your HTTPS version doesn’t work.The main purpose of a plugin is to make money. Really Simple SSL provides premium packages.
You should fix mixed content issues without any plugin for maximum performance instead of relying on plugins that have high consumption, and you end up buying an expensive plugin.At One Smart Sheep, we fix the mixed content issue without any plugin, making the site faster as requests are made from the server level.
Is Cloudflare Effective to Fix Mixed Content?
Cloudflare has several features that may fix the mixed content problem, but it doesn’t. When you turn on Always Use HTTPS and Always HTTPS Rewriters, the issue will not be resolved, most probably.
People have been complaining about it on many social media platforms, including the Cloudflare community.
You should fix it from on server rather than Cloudflare.If Cloudflare has fixed your issue, let us know in the comment section.
Is ‘Better Search and Replace Plugin’ Safe For Fixing Mixed Content Issue?
Better Search and Replace’ plugin is a helpful plugin that can fix HTTPS issue, but not in all cases.I installed a demo theme on a dummy WordPress to show you how it works.I’ll try to fix the mixed content issues with the help of the plugin.
I activated it.
I added a rule.
When I added the rule, the site was destroyed. It didn’t work as expected.
But the good news is that you can remove the rule that you added that fixes the issue that you have encountered.
Why Is Elementor Not Working with HTTPS?
If you’re using Elementor, there is a greater chance of having mixed content issues on your website.You can quickly fix it by going to Tools>ReplaceURL and type your old URL without HTTP and replace it with HTTPS.
And don’t forget to regenerate files otherwise, the changes will no longer work.
Does the issue persist still?Try the manual method without a plugin. Keep reading...
Examples of No Mixed Content Error in Different Browsers
Here are real examples of different browsers and how they look when mixed content issue is resolved:
1. Chrome No Mixed Content Warnings Example
If you’ve fixed the mixed content issue, Chrome will award you with a green padlock :)
2. Firefox No Mixed Content Warnings Example
Firefox indicates the connection is secure after you’ve fixed the mixed content warning. When you click the > icon, you can see which authority has issued the certificate.
3. Edge No Mixed Content Warnings Example
Edge runs on chromium shows the same as Google Chrome.
4. Opera No Mixed Content Warnings Example
Opera also runs on chromium, but it doesn’t show the green padlock :D
Final Thoughts
Fixing mixed content is not easy to solve in most cases, but having technical knowledge can really help you.It doesn’t only impact your user experience, but also negatively affects your SEO performance.If you can’t afford to fix your WordPress issue every second day and don't want to waste hundreds of dollars, you should hire One Smart Sheep that fixes, builds, maintains, hosts websites on ultra high-speed servers and many other great features for a flat rate so that you don't need to worry about any issue that may arise in future.The most effective method is the one that is done manually with the .htaccess file since it doesn’t put any strain on the CPU otherwise using Really Simple SSL and other plugins cost you money in the long term due to higher consumption of your resources.
Frequently Asked Questions
How do I fix the mixed content error?
Mixed content errors occur when a website is not fully secure, meaning that some elements of the page are loaded over HTTP instead of HTTPS. This can happen when you install a new plugin or theme or update your site's settings. It's important to fix mixed content errors as soon as possible to ensure that your site is secure and your visitors' data is protected.Here are some steps you can take to fix mixed content errors:
- Update all internal links to use HTTPS: This includes updating any internal links within your site, such as links to images, scripts, and other resources. You can do this manually by editing each link in your site's code, or you can use a plugin like Better Search Replace to automate the process.
- Update any external links to use HTTPS: This includes links to external resources, such as social media profiles or third-party services. You can usually find the HTTPS version of a resource by adding "https://" to the beginning of the URL.
- Use a plugin to fix mixed content errors: There are many plugins available that can help you fix mixed content errors, such as Really Simple SSL or Better Search Replace. These plugins can automatically update links and resources to use HTTPS, making the process much faster and easier.
- Check your SSL certificate: Make sure that your SSL certificate is valid and installed correctly. You can check this by visiting your website and looking for the padlock icon in the browser's address bar. If the padlock is not present, there may be an issue with your SSL certificate.
- Use a content delivery network (CDN): A CDN can help to improve the security of your site by encrypting all traffic between your server and visitors' browsers. This can help to prevent mixed content errors from occurring in the first place.
How can I bypass mixed content errors?
While it's not recommended to bypass mixed content errors, there are some ways to temporarily ignore the error and access the site. However, this is not a long-term solution and can compromise the security of your site.One way to bypass mixed content errors is to disable HTTPS and revert back to HTTP. However, this will remove the security benefits of HTTPS and could leave your site vulnerable to attacks.Another way to bypass mixed content errors is to use a browser extension or plugin that allows you to ignore the error and access the site. However, this is not a recommended solution, as it could put your data and privacy at risk.The best way to address mixed content errors is to fix them by updating all links and resources to use HTTPS, ensuring that your SSL certificate is valid, and using a content delivery network (CDN) to encrypt traffic. By fixing mixed content errors, you can ensure that your site is secure and your visitors' data is protected.
How do I get rid of mixed content errors?
Mixed content errors occur when a website is loaded over HTTPS, but some of its resources are loaded over HTTP. To fix this, ensure all resources (like images, scripts, and CSS files) are loaded over HTTPS. You can do this by updating URLs in your website's source code or database to use "https://" instead of "http://". Tools like SSL Insecure Content Fixer can help automate this process.
How do I fix WordPress plugin errors?
To fix a WordPress plugin error, first identify the problematic plugin by deactivating all plugins and then reactivating them one by one. Once identified, check for updates for that plugin, as an update may resolve the issue. If the problem persists, contact the plugin developer for support or look for alternative plugins.
How do I fix WordPress theme errors?
If a WordPress theme is causing errors, switch to a default WordPress theme (like Twenty Twenty-One) to see if the issue resolves. If it does, the error is likely within your theme. Update the theme if an update is available, check for conflicts with plugins, and ensure all theme files are correctly uploaded. If necessary, contact the theme developer for assistance.
How do I fix mixed content issues with Elementor?
In Elementor, mixed content issues can be resolved by ensuring that all URLs in your Elementor content use HTTPS. Use Elementor's "Tools" section under "Elementor" > "Tools" > "Replace URL" to update URLs from HTTP to HTTPS. Additionally, check your site settings and make sure the WordPress Address (URL) and Site Address (URL) are set to HTTPS in the WordPress settings.
