Don't forget to update the CSS!

I had been meaning to set up my blog page to use SSL/HTTPS for a while. Today I did it. It's amazingly simple since Github Pages has teamed up with LetsEncrypt. So I just had to tick one box. Go to your Github pages Repo, in my case, and select the settings tab, or go to your repo /settings, Once there simply scroll down to the Github Pages section and tick the box labelled "Enforce HTTPS". Within 2-3 minutes Github will get a certificate for you (in my case for my custom domain name!) and apply it.

This was great, my website worked at but wait, all the formatting and layout looked like HTML v1.0 and hideous!

I noticed in Chrome that it was complaining that it was only displaying the secure content….not the insecure….“What insecure content??”

A quick trip into the developer console in Chrome by hitting F12 showed the culprit. The CSS was building from information somewhere with an explicit http in.

I found that it was the _config.yml file which needed the “Site Wide Configuration” section URL value updating to be

After editing that, 2 more minutes for Github Pages to recompile, and back to looking lovely!