When you browse Internet sites you could see that some of them are opened via HTTP (at the beginning of the site URL) but some via HTTPS (this is an extension of the Hypertext Transfer Protocol for secure communication). The second type of connection is more secured and any data send by the user to the website (by example web forms, login info etc…) is encrypted.

In this tutorial I’ll show you how to install SSL certificate via your web hosting control panel and how to configure the WordPress website hosting environment and your site to forward (via 301 Redirect) all your traffic from non secured to secured connection, so to fix the Mixed Content Error. To achieve this you could follow the next easy examples:

  • cPanel – Linux
  • Plesk – Windows
  • Configure WordPress to load all content from HTTP to HTTPS

cPanel (Linux)

You should follow the next steps to enable the AutoSSL for a cPanel account for which you wish to install Free SSL.

1. Login into WebHost Manager.
2. Home -> SSL/TLS -> Manage AutoSSL.
3. Click on “Manage Users” tab -> search the user -> select “Enable AutoSSL”.

The other approach is to use the Let’s Encrypt SSL.

1. Login into your cPanel.
2. Click on Security -> Let’s Encrypt for cPanel.
3. Check the section “Issue a new certificate” and tick the boxes near your domain name.
4. Click on “Issue Multiple”.
5. Tick the box on “Primary” near the domain with/without www depending on your choice.
6. Tick the box near “Install mail”.
7. Click “Issue”.

Using .htaccess

To force all web traffic to use secured connections, insert the following lines of code in the .htaccess file in your website’s root folder.

RewriteEngine On
#RewriteCond %{HTTPS} !=on
#RewriteRule ^/?(.*) https://%{SERVER_NAME}/$1 [R=301,L]

Plesk (Windows)

You should follow the next steps to get a Let’s Encrypt free SSL certificate for your domain:

1. Log in to Plesk.
2. On the (left) sidebar, click “Websites & Domains”.
3. Click on the “Let’s Encrypt” symbol to pull up the Let’s Encrypt SSL Certificate page.
4. Type a valid e-mail address in the box.
5. Select the “Include www.(yoursite.com)” as an alternate domain name check box, so that the SSL certificate protects your domain with and without the www prefix.
6. Click “Install”
7. On the (left) sidebar, click “Websites & Domains”.
8. Click “Hosting Settings”.
9. Under Security, select the SSL support check box, and the Let’s Encrypt SSL certificate in the Certificate list box.

Using web.config

To force all web traffic to use secured connections, insert the following lines of code in the web.config file in your website’s root folder. It should be located in the <system.webServer> section.

 <rewrite>
   <rules>
    <rule name="Redirect to https" stopProcessing="true">
     <match url=".*"/>
     <conditions>
      <add input="{HTTPS}" pattern="off" ignoreCase="true"/>
     </conditions>
     <action type="Redirect" url="https://{HTTP_HOST}{REQUEST_URI}" redirectType="Permanent" appendQueryString="false"/>
    </rule>
   </rules>
 </rewrite>

Configure WordPress to load all content securely

The best way doing this is to add the HTTPS version of your site as WordPress Address (URL) and Site Address (URL), by example https://www.besthostingwp.com. To do this you should login into your wp-admin, and after that choose “Settings” -> “General” from the left admin menu.

To force all logins and all admin sessions to happen over secured connection you should write the following code into your wp-config.php:

define(‘FORCE_SSL_ADMIN’, true);

FORCE_SSL_ADMIN should be set before wp-settings.php is required.