I decided to play around with GitHub pages a little and this website here is the result. It turns out it’s surprisingly easy to get a simple website up and running, especially if you’re familiar with GitHub and git.
Jekyll is a simple blog-aware site generator that let’s you write a static website with markdown alone. Editing HTML and CSS files is possible but not required, so I’d say it’s a good compromise between ease-of-use and flexibility/power.
Using GitHub pages allows me to view and test my website live online without the need to install Jekyll or any other software locally. The disadvantage is that my ugly work-in-progress website is online for everyone to see. But let’s be realistic, nobody is going to read this anyways.
Creating the website boils down to these simple steps:
- Create a GitHub repo called YourUsername.github.io (as described here)
- Search the web for a Jekyll theme you like (I used Hydeout)
- Clone the theme’s GitHub repo
- Move and add the theme’s files to your own repo, then commit and push them
- After a few seconds, you should be able to reach your own (template) website at https://YourUsername.github.io.
My first attempt produced a very incomplete and buggy website that didn’t look like the example page of the Jekyll theme I chose (Hyde). Turns out the theme was no longer maintained and incompatible with the latest version of Jekyll. I fixed this issue by using the newer Hydeout theme as described above, which works flawlessly as of now.
In general, if the website you’re seeing is buggy or seems incomplete, you should check out the settings menu of your website’s repo: https://github.com/YourUsername/YourUsername.github.io/settings. Any errors or warnings when building your website are reported under the GitHub Pages header.
After you got the template up and running, it’s time to remove the template’s example content and add your own. In my case, I started with the _config.yml, which defines things like the title and subheading of the website as displayed in the sidebar. Next stop is the _posts/ directory that contains all blog posts. I removed all the template’s test posts and added my own first post here!
Comments