All engines are go

03 Mar 2017

Getting Jekyll to work with Github Pages.

I finally got this working. Feelin’ nice yo. Here’s what I did. I installed Hyde on Github pages in the most cavalier way possible.

I read a lot of blog posts on how to get Jekyll up and running on Github pages and they really did explain a lot but it just didn’t work for me at all.

I seriously read a huge blog post that started with the idea of a command line and slowly built up from there on how to install and get things working.

I almost tried it, but it was for a page that would be a project page (and not an author page) so I felt like it was not of much use to me.

I think I have used a very simple method (though it did take some trial and error to figure out) of running a Jekyll blog on Github. The best thing about it all is the fact that you don’t need to install anything on your computer to get it working other than git and an editor that supports markdown, I use and highly recommend Visual Studio Code.

Here are the steps that I used, in quite some brevity:

1. Create a repository named yourusername.github.io
2. Go to settings of your repository and select a theme to be used by your site. Just pick anyone, it doesn’t matter which.
3. Clone your repository to your computer.
4. Download the Hyde theme and save it on your desktop.
5. Open the _config.yml file in your repository.
6. Copy over the contents of the _config.yml of the Hyde folder into your repository’s _config.yml
7. Go over the _config.yml file in your repository and remove the theme: key and also the CNAME. Remove the entry about relative permalinks as that will cause Github to complain and fail to build your site.
8. Change other settings such as names in the _config.yml file.
9. Copy over the rest of the content of the Hyde folder.
10. Commit the changes. You might have to run git add . while in the root of your repository to get it to stage all the files properly.
11. head over to yourusername.github.io and the site is live there.
12. add new posts remove old ones, follow the post naming convention and also don’t forget to include the header that starts with three dashes in every post you make.

Now your site is up and running. Happy maintaining.

If you want to get a custom favicon, you will have to do some hacking. You need to replace the image files in the public folder. Replace the files, but ensure that you keep the same names for them. Also the bigger image has to be a size 144x144, so use any online image resizer. Then use an online favicon maker to turn that image into a favicon.

Finally, go to the file _includes/head.html and in the line with the favicon add a ? after the favicon.ico, but before the quote mark. Read more here.

Checking if math works:

\[E=mc^2\]

The instructions from this site got me working math. It does imply that I have to write \{\% include lib/mathjax.html \%\} at the end of every post that I want to display math on (without the backslashes), so I will have to see if there is a better option. I am, however, satisfied for now.