How to go secure (https mixed content)

First of all, you need to set the default version of your website to open exclusively through https.

You can do this using another tutorial on our website. But I assume you have already done that and got a gray https instead of the green you expected.

First, let’s check the 3 possible options:

Google SSL warnings How to go secure (https mixed content)
  1. Your website has active SSL, but the content is not loaded completely with HTTPS. In this case, you need to follow the instructions below to fix it and become “Secure” like the third example.
  2. You don’t have active SSL. Contact your hosting support to activate SSL for you (nowadays, everyone has free SSL; if your hosting provider says you have to pay something to have SSL, change them immediately).
  3. The best option is that you have active SSL, and everything on that page is loaded via HTTPS, so you don’t need to do anything.

Why is it not green (secure)?

The reason is quite simple, as stated in the notification when you clicked on https: some part of your website is loaded with http while the site is opened with https. The solution is that EVERYTHING on the site must be https, and what is loaded on the site (such as images, CSS, JS…) must be linked with https. Only then will it be secure!

Since we got the answer to how and why, let’s fix it without knowing programming languages or HTML/CSS.

First, how do we determine what is loaded with http?

Simply press F12 (Chrome), and you will see an add-on in the lower corner like in the picture:

mixed content

After that, click on the numbers in red and yellow in the upper right corner of that new window next to the “x” as marked with a red square.

In the lower part, errors and warnings will appear as in the picture:

mixed content

As you can see, it says exactly what is not being loaded, which image, or something else, through https. Simply by changing that link on the site in the address bar, you will see “secure” if you have done everything correctly. You need to do this for every page on your website.

If it is some part, like an image written in the code of the website, in a PHP/HTML/CSS file, you need to open that file manually and make changes.

If it is written in the database, as in the case of writing a post or using a page builder, you can edit it using the “search and replace” plugin. There are many plugins on this topic, so choose the one you want, making sure that the plugin’s update is recent (less than 6 months).

The link for the search is: https://www.google.rs/q=search+and+replace+wordpress+plugin

  • I did not leave a link to any plugin because, after a few months, someone might come across this text and download the recommended plugin, but in the meantime, the author of the plugin may have stopped updating, causing more harm than good. That’s why you need to check which plugin is better, both by the number of ratings and regular updates.
Scroll to Top