1. Install and activate an SSL certificate

There’s two options for this:

  1. The simplest and cheapest (free!) option for this is using Let’s Encrypt.
  2. You may alternatively follow our guide to purchase and install a commercial certificate.

Note: if you’re hosted with us, we enable HTTPS by default, and you may have already had a Let’s Encrypt certificate installed automatically for you. 

2. Update your web app

If you’re using a web application like WordPress or Magento, make sure you change any option within its settings to enable HTTPS first. Here’s how to do that:

  1. Log in to Plesk
  2. Within Plesk, click 1-click web apps or Installatron
  3. Click the wrench icon beside the web app installed to the domain for which you’re enabling HTTPS.
  4. Choose the Advanced tab
  5. Look for the field that has your website URL in it and change it to the value that starts with https. If you don’t see this option, look under the Files & Tables tab instead.
  6. Press the button at the bottom of the page to save your changes.

If you don’t see your app in 1-click web apps (Installatron), here’s how to import it. When imported successfully, proceed through the steps above.

3. How to force HTTPS

Be sure to only pick ONE of the options below, otherwise you will end up with a redirect loop that results in Internal Server Errors. Option 1 is strongly recommended.

Option 1: Use Plesk 17+ to force HTTPS

Plesk (Onyx/17+) comes with an option to force enable HTTPS simply by checking a box. All of our shared servers are now using Onyx, so you can make use of this functionality! Simply:

  • Log in to Plesk
  • Select “Hosting Settings” under the domain for which you wish to enable HTTPS
  • Look under the “Security” header and check the box that says: Permanent SEO-safe 301 redirect from HTTP to HTTPS.

Option 2: Use PHP to force HTTPS

At the start of your PHP file (more than likely in index.php) enter this:

if($_SERVER["HTTPS"] != "on"){
  header("Location: https://" . $_SERVER["HTTP_HOST"] . $_SERVER["REQUEST_URI"]);
  exit();
}

Option 3: Use Apache to force HTTPS

If you’re not using nginx/php-fpm direct mode, then you can simply use an .htaccess file to force https. Create a file called .htaccess (if it doesn’t already exist) within your web root, then enter the following within it:

RewriteEngine On
RewriteCond %{HTTPS} !=on
RewriteRule ^ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

Option 4: Use Nginx to force HTTPS (VPS only)

If you have admin access to your web server (ie: if you have a dedicated server or virtual server) you can make this change using a custom nginx configuration. Here’s how:

  1. Login to Plesk using your root or admin account
  2. Navigate to the domain’s settings and choose the “Apache & nginx Settings” button
  3. Under the “Additional nginx directives” box (only visible when logged in with admin privileges) enter this:

if ($scheme != "https") {
rewrite ^ https://$host$uri permanent;
}

Save your settings and you should find all requests now redirect to https.


Troubleshooting

If, after completing the above steps, you still don’t see the green lock/bar in your browser when visiting the site, or your browser indicates the site is not secure, parts of the site are not secure, or provides a mixed content warning, this is because your browser is still seeing some resources at HTTP and not HTTPS. The steps below will help you fix this.

Caches

Often the non-HTTPS resources have actually been changed, but your cache hasn’t been updated either server-side or in the browser. To resolve this, clear your website cache (ie: WP Super Cache, WP Rocket, W3 Total Cache, etc), then clear your browser cache.

Inform WordPress or other CMS

If you’re using WordPress, read here to learn how to manually adjust your content to use https URLs or install a plugin to help replace those URLs automatically.

If you’re using a CMS that isn’t WordPress, check its configuration files or settings to find any location where it’s configured to use http://yoursite.com and replace it with https://yoursite.com

Use your browser’s web inspector to identify http resources

If after clearing all caches and informing your content management system of the https change, you still don’t get a green lock/bar, the best way to find out what files seem to be causing problems is to use your browser’s web inspector tool. In some cases this tool will be available immediately, in others (like Safari) you need to enable Developer mode.

You can access the web inspector by right clicking on the web page, then choosing “Inspect” or “Inspect Element”. Once you have access to the web inspector, check its console (typically a tab of the web inspector) and look for errors and/or warnings like this:

[Warning] The page at https://your_url/ was allowed to display insecure content from http://your_url/wp-content/uploads/2015/12/web-design.jpg. (your_url, line 857)

These indicate which files are not being loaded via HTTPS. You can use this info to find where they’re being loaded in the back-end and change to them. You could change them to:

  1. Relative URLs by removing the entire first part up to the end of the domain. Ex: /wp-content/subdir/myfile.jpg
  2. Protocol Agnostic URLs by replacing the http:// with simply //. Ex: //websavers.ca/wp-content/subdir/myfile.jpg
  3. Absolute URLs by simply swapping http with https. Ex: https://websavers.ca/wp-content/subdir/myfile.jpg

We tend to prefer Relative URLs first, then Protocol Agnostic URLs, and lastly Absolute URLs, although any of them will solve the problem.

For each mixed content or insecure content warning in the console, find a matching URL in the web app settings or page or post content and you’ll be all set!

This is done by finding where each of those resources is linked in the code or CMS back-end / page content then changing the URL as described above. (ex: on a page? In the theme settings? In the plugin settings?).


Did you find this guide helpful? Want more great WordPress help and general website assistance? Consider switching your website hosting to Websavers! You could try out our shared hosting or a Canadian VPS hosting plan.

About Jordan Schelew

Jordan has been working with computers, security, and network systems since the 90s and is a managing partner at Websavers Inc. As a founder of the company, he's been in the web tech space for over 15 years.

2 Comments

  1. Kris on October 6, 2018 at 6:00 am

    Well the PHP solution is a bit goofy for WordPress, so I found a plugin (there are several):
    https://wordpress.org/plugins/force-https-littlebizzy/

    • Jordan Schelew on October 8, 2018 at 8:45 pm

      Hey Kris,

      For performance reasons it’s always best to do this within your web server config as described in any of the Plesk, Apache or Nginx instructions. But failing that the PHP solution or any WordPress plugin that accomplishes the same thing is a great alternative! Thanks for the comment 🙂

Leave a Comment