How to Fix the Mixed Content Error in WordPress ?
A common example of mixed content would be when an image is loaded as insecure (http://mydomain.com/image.jpg), but the page was requested with SSL (https://mydomain.com).
This can have one of the two following effects on your site:
⦁ The secured padlock symbol does not appear, or is broken
⦁ The secured padlock symbol does appear, but an image or resource does not
You can confirm if your site is being affected by mixed content errors by checking the Inspect Element console.
You will see yellow warnings if the insecure content is causing the padlock to not show, and red warnings if the content has been blocked from displaying because it is insecure.
⦁ In most browsers right-click anywhere on your page and choose Inspect.
⦁ Click on the Console tab. If your browser has flagged anything as insecure it will show here.
⦁ Plugin developers sometimes use absolute paths (http://yourdomain.com/style.css) in their plugins or themes to link to CSS and JavaScript instead of using relative paths (/style.css).
⦁ Images have hardcoded URLs (http://yourdomain.com/image.png) that point to HTTP. These could be within a post, page, or even a widget.
⦁ Your linking to HTTP versions of external scripts. (Hosted jQuery, Font Awesome, etc.)
⦁ You have embedded video scripts using HTTP instead of HTTPS.
⦁ Make sure that you have activated SSL for the domain.
⦁ You can use the Wordpress plugin "SSL Insecure Content Fixer" which is recommended by Wordpress to fix the Mixed content error.
⦁ 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.
They are:
⦁ Simple
⦁ Content
⦁ Widgets
⦁ Capture
⦁ Capture all
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.
After choosing the HTTPS detection, click on the save changes button to store your settings.
Also, 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.
This will fix the Mixed content error in the Wordpress.
This can have one of the two following effects on your site:
⦁ The secured padlock symbol does not appear, or is broken
⦁ The secured padlock symbol does appear, but an image or resource does not
You can confirm if your site is being affected by mixed content errors by checking the Inspect Element console.
You will see yellow warnings if the insecure content is causing the padlock to not show, and red warnings if the content has been blocked from displaying because it is insecure.
⦁ In most browsers right-click anywhere on your page and choose Inspect.
⦁ Click on the Console tab. If your browser has flagged anything as insecure it will show here.
What Causes Mixed Content Warnings?
⦁ Plugin developers sometimes use absolute paths (http://yourdomain.com/style.css) in their plugins or themes to link to CSS and JavaScript instead of using relative paths (/style.css).
⦁ Images have hardcoded URLs (http://yourdomain.com/image.png) that point to HTTP. These could be within a post, page, or even a widget.
⦁ Your linking to HTTP versions of external scripts. (Hosted jQuery, Font Awesome, etc.)
⦁ You have embedded video scripts using HTTP instead of HTTPS.
Now let us see how to fix Mixed Content Error in Wordpress.
⦁ Make sure that you have activated SSL for the domain.
⦁ You can use the Wordpress plugin "SSL Insecure Content Fixer" which is recommended by Wordpress to fix the Mixed content error.
⦁ 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.
They are:
⦁ Simple
⦁ Content
⦁ Widgets
⦁ Capture
⦁ Capture all
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.
After choosing the HTTPS detection, click on the save changes button to store your settings.
Also, 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.
This will fix the Mixed content error in the Wordpress.
Updated on: 14/02/2023
Thank you!