Fixing WordPress HTTPS Mixed Content Error

If you’ve recently added an SSL certificate to your site, you may expect to see a green padlock in the URL bar when visiting your site. However, you may run into a conflict called “Mixed Content”. This means the site is being loaded with SSL (for example: https://mydomain.com), but not all the elements loading on your page are being loaded with SSL.

What is Mixed Content?

When an image, font, or icon is loaded over http://mydomain.com, but the page was requested with SSL (https://mydomain.com). It's called Mixed content.

These Mixed Content effect two points:

  • The green padlock does not appear
  • The green padlock does appear, but the insecure image or resource does not

How to check Mixed Content Errors in your site?

Check the Inspect Element console in your site. If the warning is in yellow color that means your content is insecure and causing the padlock to not show or if your warning is in red color that means content has been blocked from displaying because it is insecure.

How to Fix Mixed Content Error?

 

  1. Searching for Mixed Content and fix it:

 Open the source code of any page of your website. Search “src=http” using a search function and look resources such as images, JavaScript, and links that are being called over a non-secure (HTTP) connection. Once you find the content being served over HTTP vs. HTTPS fixing the issue is often as simple as adding an “s” to links – http:// to https://.

  1. Search/Replace your database for insecure content:

Before running a search and replace, backup your site. Need the Search and Replace plugin in your site. Installed it and activate it. Search for “http://yourdomain.com” and replace it with https://yourdomain.com.

  1. Insecure Content Fixer Plugin:

 Install the SSL Insecure Content Fixer plugin. This plugin will replace elements on the page depending on the options that are specified within the settings. The default option is to use a Standard WordPress function, which will work most of the website. Below that you will see other options select the method that you think applies to your website depending on your particular setup. After making these changes, be sure to also use the Purge All Caches button in the WordPress Admin Dashboard.

  1. Use Really simple SSL Plugin:

Installed Really simple SSL Plugin and active it. Make SSL enable in your plugin setting.

I hope this post helps you to set up HTTPS on your website. If you need any help stay in touch with us. Our Experienced Developers are ready to help you.