New Site (Again)
This isn’t the first time I’ve moved my personal site; the first post I still have was after I lost some old blog posts, and I moved to WordPress in 2012 to avoid supporting a separate blog and page builder. However, it was still running on my VPS, and I’ve been trying to remove all production content from there for a while.
Enter Jekyll and GitHub Pages.
We’ve been using GitHub Pages on the technology blog for a while, and for the most part it’s quite easy to manage blog posts and pages in a simple structure, and of course all version controlled. With it being static, there are some restrictions to what can be done directly, but thankfully there are some helpful tools out there to add back in the important dynamic features.
Basics
I first chose an appropriate theme for the site. For this I used Brian Maier Jr’s Long Haul theme, which fitted very closely to what I had in mind. I’ve changed very little of the site structure and it’s great that there are such well-designed themes to use.
I added a contact form using formcarry, which allows you to build a very straightforward contact form to send on to an email address.
Migration
To migrate the existing content from my WordPress site, I used the WordPress Jekyll Exporter to export all posts and content into Jekyll posts and pages. I did a little work to tidy up the posts and images, and I decided to revert the parsing for smart quotes and the like, but avoided the bulk of the heavy lifting.
The few comments I had were exported using WordPress Comments Import & Export plus a quick PHP script to convert them to a suitable YAML format (more on that later).
Site Map
I added an XML site map for Google, and a more human-readable version for everyone else. I started off using the jekyll-sitemap plugin, but that did not pull any GitHub project pages, which meant my CV page wasn’t included - I have a separate project for that and decided to keep them separate for now. So I copied the layout from the plugin and added my own section for the showcase, using github-metadata instead.
I’ve seen some rather messy solutions for category/tag pages including using query string parameters / JavaScript to manipulate a page, but found a nice solution using collections instead.
Comments
The technology blog uses Disqus and while it doesn’t really require any effort to moderate, the performance burden is terrible. This post shows exactly the effect Disqus can have on a page load. That post goes on to suggest using GitHub comments instead, which requires a long-running issue for each post with comments, and requires JavaScript to post them.
Instead I found Hacker News to be very helpful in suggesting Staticman, which allows comments to be stored as data in the repo, and the comment form ultimately results in a Pull Request being generated with the comment details. Fits perfectly with the rest of the site! It also meant I could recreate the existing comments with very little effort.
Summary
I’m pretty happy that, with everything else going on, this was a nice way to do some digital housekeeping and I’m happy with the output after a couple of weeks. I’m sure I will keep working on it though — maybe I will finish the interests section after 10 years)…
Leave a Reply