https site ready

TLS/SSL certificates setup on my host

So its been a month since my last post and I have now managed to add the majority of the projects (with demo links) to the site. 🙂

I have also made the site secure with https. This involved quite a bit of reading and understanding and I hopefully have a fairly good grasp of how this stuff all works now. So the following is my notes (and anyone else who is interested in this) for the steps I took. I will walk through this process below.

https Process

My first step was to do some reading and learning. I found the following page: The Complete Guide To Switching From HTTP To HTTPS to be very comprehensive. It explains the history and the benefits of converting your site to https and the various different types of security certificates available. It covers Purchased and Free certificates and how to setup your site under various platforms, etc. From this I decided to run with a free certificate (if I could achieve it) which can be supplied from “Lets Encrypt”. I am currently hosting on a very basic plan (Linux host with cPanel), so I was hoping to achieve this through the cPanel and/or through my SSH connection.

The page mentioned above did have a section on setting up a free certificate from “Lets Encrypt”. Unfortunately this guide assumed you had a special “Lets Encrypt for cPanel” option on your cPanel host – my host did not. So I found another guide How to install a Let’s Encrypt SSL on a shared GoDaddy hosting account to be very helpful. The guide on this page directs you to a site called Zero SSL – this site takes you through the process of obtaining and setting up the certificate files you need. The guide then shows you how to apply the certificate to your site via the cPanel. Wallah! My site was now showing it was secure in Chrome at https://craigeastwood.com !

WordPress specific changes

Now I needed to adjust my site so that WordPress pointed to https rather http links, and provide an automatic redirection for links going to the http location. At his point I found another guide: How to Move HTTP to HTTPS on WordPress which covers the specifics of a WordPress site. This includes:

I made these changes and my LIVE site was working as expected. However, I needed to consider my development environment as well… The security certificates and changes to config files to not apply to my development environment, but I also wanted to keep/remember the changes in my source for the site – how could I achieve this without breaking either my LIVE site or local development site??

Adjusting for my local development

My local development is a fairly complex setup. I am using Vagrant in combination with VirtualBox and configuration tool Puphpet and unfortunately I only knew the basics of this setup, and this cost me a lot of time.
I made the mistake of changing the address of local development site to “https” in WordPress. Once I did this I could no longer could access my development site! ie. Page not found! This is where the fun began! I needed to access the database manually to change this back – but I had not done this before. This took many hours of stuffing around. In hindsight it would have been better to read through the Puphpet and Vagrant documentation – instead I tried to manually work out what was going on.

Local Development Database Access

Instead of using phpMyadmin to access my localbase I installed Heidi SQL, and after of few hours of stuffing around I found that I need to connect to my virtual box using SSH tunnel – using the private key, downloading Putty Link, configuring the local hosted IP. I still needed to know the database name, user and password. I could then access the WordPress database and change the “https” to “http”.

Unfortunately, it did not end there! As it turns out I had also changed my .htaccess file to perform the redirection (from http to https) – but I had already changed that back – and the browser was still redirecting automatically to the non-existent https site! I found that the browser caches this information somehow – so I had to remove all HISTORY related to my local site from my browser and this fixed the problem – I had my local development site back!!
That wasted a lot of time! But I guess I learnt a bit more about my local server configuration and database setup.

Managing config for local and production site in the source

For my production deployment I am using Git in combination with Buddy Works deployment tool. I wanted to put the https redirection change into my standard source – without effecting my local development. To achieve this I have a NEW file in my source called .htaccess.deploy – this file contains the redirection code for production sites. I have a script within my Buddy Works deployment tool that renames this file to .htaccess for the appropriate production deployment pipeline (ie. Development, Staging and LIVE)

Development and Staging sites secure

Up until now I had my development and staging sites as a subfolder location of my live site. Converting over to https on the LIVE site made this a little cumbersome to maintain. So after some research, I decided to move the sites over to subdomains. I achieved this by creating the subdomains (for development and staging) in the cPanel. Once this was done I used the method mentioned above (ZeroSSL) to create a certificate for BOTH the development and staging subdomains (you can put more than one subdomain on the one certificate). (Note: I am not sure if I could have my LIVE site on the same certificate as well? I may try this when I need to renew). I then followed the same process in cPanel to setup the certificate for each of the subdomains and they are now both running with https!

Renewing certificates

Free certificates issued by Lets Encrypt are only valid for 90 days (other paid for certificates are usually 1 year). I will like to investigate if it is possible to setup some auto-renew process (maybe via a cron script) on my hosted server. However at the moment I will be notified by Lets Encrypt (via email) when the certificate is about to expire and renewal process should only take a few minutes (now that I know what I am doing!)