How to Fix WordPress Mixed Content Error

It is no longer optional but mandatory to operate your WP website over HTTPS. Apart from being more secure,HTTPS also creates trust in users. In addition,it is one of the major SEO ranking factors,and it offers precise referral data.

However,if you moved your site from HTTP to HTTPS,& yet receiving warnings on mixed content or “Unsecure connection to this site,” then do not freak out. Instead,you need to fix this error to stop getting warnings from browsers like Firefox and Google Chrome.

In this article,you will learn about mixed content error,its causes,and how to fix this issue on WordPress website.

If – at any time – you need some additional explanation or guidance,click this link to contact us. -

What is a Mixed Content Warning?

A warning that shows in your browser if your WordPress website happens to load both HTTP and HTTPs content or scripts at the same time. This means there is delivery of non-secure (HTTP) and secure (HTTPS) content over SSL to your browser,leading to mixed content error.

Loading both of them is unacceptable,as they have entirely different protocols. Thus,when you move your site to HTTPS,all its content should run over HTTPS.

What are the Causes of Mixed Content Warnings?

The most usual time when mixed content warnings occur is immediately after moving your WP site from HTTP to HTTPS.

One of the reasons is that the HTTP links were carried over,leading to the start of mixed content warning on your WP site. Alternatively,you recently added a new plugin or service on your site.

Here are extra reasons that may cause the warning:

  • – One of your articles is linking to HTTP versions of the external scripts like Font Awesome,Hosted jQuery,and others.
  • – Sometimes,the plugin developers apply absolute paths like (http://yourdomain.com/style.css) in their themes or plugins to integrate to JavaScript and CSS,rather than applying relative paths like (/style.css).
  • – Your website has embedded video scripts that use HTTP rather than HTTPS.
  • – Either any of your page,widget,or post has images with hardcoded URLs like (http://yourdomain.com/image.png) which point to HTTP.

How to Fix Mixed Content Error

When it comes to fixing mixed content error,our assumption is that you have already done the following on your website:

  • – Migrated from HTTP to HTTPS.
  • – Installed an SSL certificate

Here is a simple systematic guide to fix the mixed content error.

(btw,if you’re confused in any way,reach out to us on Social Media for answers.)

Step 1

Finding out the resources that are continuing to load over HTTP is the initial step to fixing this error. This may be occurring in specific areas of your website. So,browse to the page that is occurring and then launch ChromeDevTools.

To launch this tool click F12 or ctrl+ shift+ I. Next,go to Developer tools>> More tools>> ChromeDevTools.

Step 2

You can use any of the many places to determine the resources that are loading via HTTPS. One of them is the “Console” tab.

In addition,you can check that in the “Security” tab. This tab indicates the non-secure sources. To see them,click on “View the request in the network panel.

Lastly,you can use the “Network” tab to see the requests.

Please note:

After opening ChromeDevTools,you may need to refresh the page for proper loading of its contents when using any of the above tabs.

Nonetheless,if you just want a quick summary of the errors and you are not using Chrome,then go for a free tool such as Why No Padlock. This tool performs scans on an individual page and then displays all the unsafe resources.

Step 3

In this step,you will confirm if you can access those resources loading via HTTP through HTTPS. However,there are higher chances,as all you need is updating the links.

For example,take a link of an insecure image and input the URL in your browser address bar. After that,add HTTPS on its start,and click the load button. The loading will be fine. Thus,you need to go on and perform a search,and then substitute it on your website.

Step 4

Methods of performing WordPress search and replace. The most common method involves the use of tools. In this case,we recommend the use of Better Search Replace plugin that is free. Once you are done with your search,delete the plugin.

You can either search this tool in your WP dashboard>> Add New plugins. Alternatively,download it directly from the WordPress repository. You are free to search your HTTP domain after its activation. After that,replace the HTTP domain with your HTTPS domain.

Step 5

It is now time to double check your website to verify if the mixed content warnings disappeared. The best way to do so is to visit your website,click some pages as you observe their status in your browser address bar.

Most mixed content error fixing is through the search and replace method. However,you might face extra problems if you have hardcoded anything in your WP website. In such a case,you should contact a reliable developer for help.

Summary

In most cases,a simple search and replace method will easily fix your mixed content error within minutes. Nevertheless,this is not the case if you have some hard coded scripts on your site. These require you to perform manual updates or contact your developer.

In addition,you should be careful on the SSL certificate provider you use. Choose a reliable and Google recognized SSL certificate provider.

In case you run into an issue,have a suggestion,or comment,please click this link to contact us for more detailed guidance: -