Setting up SSL on GitHub Pages

Written by Tom Janssens on 28 April 2016

We use GitHub Pages to host our Jekyll powered website. Unfortunately, it does not support HTTPS for custom domain names.

Nevertheless, we just enabled HTTPS for our website by using CloudFlare.

Why use HTTPS?

There has been a growing movement to get all websites to use SSL connections where possible. Nowadays, Google even uses it as a criterion for ranking websites.

You should protect your website with HTTPS, even if it doesn't handle sensitive communications, like ours. HTTPS provides critical security and data integrity both for your website and the people that entrust your website with their personal information.

Video covering Chrome developer tools that help you roll out HTTPS.

GitHub Pages

GitHub offers a fantastic free hosting solution for static websites directly from your GitHub repository. Just edit, push, and your changes are live.

GitHub Pages are typically hosted on a subdomain of github.io, like https://username.github.io/repository. You can also use your own custom domain, like we do with http://www.timble.net.

One disadvantage of using a custom domain is that the website will no longer run over HTTPS.

CloudFlare

CloudFlare, a web security company and CDN provider, makes SSL easy. They are on a mission to build a better internet. Since 2014 they have enabled SSL by default, for all customers even those on their free plan.

Setting up SSL for GitHub Pages is simple:

  1. Head over to CloudFlare and create an account
  2. Specify the website you want to use
  3. Have a coffee as CloudFlare scrapes your DNS records
  4. Verify the DNS records (in our case some records were missing)
  5. Set the SSL option to Flexible
  6. Set up Page Rules to always redirect users to your HTTPS URL
  7. Head over to your registrar and change your nameservers as provided by CloudFlare
  8. Go for a walk until DNS propagation is done (it can take a few hours)

CloudFlare states that it can take up to 24 hours to provision the SSL certificate. In our case, it took less than an hour.

Once everything is set up correctly you can also enable HTTP Strict Transport Security (HSTS). It protects your users from man-in-the-middle attacks

That’s it! You’ve taken an important step towards making the web browsing experience more secure and private for your users.

Need help?

Need help with GitHub Pages, CloudFlare or Jekyll? Contact us.