Goodbye Jekyll

I've been thinking about moving away from Jekyll for a while now. Don't get me wrong, I love the static site generator, I really do, it's served me well for over two years, but certain aspects of my workflow have become very clunky, and overall I haven't been able to be as efficient...

Goodbye Jekyll
Red Boats, Argenteuil (1875) by Claude Monet

Goodbye Jekyll. We've had a good run. But it's time for something new.

I've been thinking about moving away from Jekyll for a while now. Don't get me wrong, I love the static site generator, I really do, it's served me well for over two years, but certain aspects of my workflow have become very clunky, and overall I haven't been able to be as efficient as much as I would have liked to be.

For those who don't know what Jekyll is, it's the static site generator that has powered the gorilla sun blog over the past two years. By throwing together a bunch of markdown, css and html files, Jekyll makes a fully functional blog possible. You just need to tell it how to tie everything together and ta-da, blog achieved. Now you can host it for free on Github Pages or a service like Netlify.

Initially, the attractive aspect about Jekyll was it's simplicity. When I decided that I wanted to start writing for the internet, I explored several options. One of them was wordpress. After a couple of minutes of trying to figure out the interface, I quickly gave up. It felt clunky, there was just too much going on, and it made me feel overwhelmed. I wanted something simpler.

I was tired of complicated blogging engines like WordPress - Tom Preston-Werner creator of Jekyll

What I needed was a homepage, an archive page and a way to easily push new blog posts. None of that extra crap. And that's when I was told about Jekyll. I messed around a little bit with the minimal mistakes template and instantly fell in love. 5 minutes later I had a fully functioning blog, AND it was online via Github pages. I didn't like the design of the minimal mistakes template however, I wanted something a little fancier and experimented with different templates, finally settling on the Editorial template from html5up. And that was essentially the design that I stuck with for the past two years.

Last April I moved the blog from github pages to Netlify. Github pages' bandwidth limit wasn't enough for me anymore. I wrote a little bit about it, but to put it simply, I didn't like that there was no way to see how much bandwidth was being consumed whilst there was a soft limit of 100GB per month. What if I need more than that?

After that I quickly got back to writing; roughly one larger piece a month. Being able to write things with markdown was a treat, but any sort of custom behaviour was a pain. Images as well as code snippets are a big part of my posts. Every time I wanted to have two images side by side I needed to post in the html code for a column layout, which quickly became very tedious. Another pain point with Jekyll was debugging. It was difficult to find solutions to specific issues that I had, especially when it came to changing around the structure of your blog.

What's more, Jekyll isn't future proof. It's not actively being developed anymore and the main github repository is frozen. At this point, it's unclear if it will ever come out of it's hiatus, only time will tell. I have ambitious plans for the Blog, which is why I can't have such a big uncertainty reside at its foundation.

Getting Spooky

I wasn't planning on making this big move as early as I did this year. But now I'm kind of glad that I've got it behind me. I'm hoping that I can focus a lot more on writing from now on.

So first of all, why Ghost? Recently I made a substack account, considering if I should start writing on there instead, or maybe even publish both on the blog as well as on substack. However that way I would be stretching myself even thinner. I was looking for something simpler and not more work. I did end up importing my blog posts to see what it's like and it seems to be working well for the most part. I liked that there's an option to have members only content with paid subscriptions. Made me wonder if I could set up a similar functionality for my blog as well. After researching for a little bit, it seemed that it would require many tears as well as figuring out programming things with which I have absolutely no expertise, for example handling payments and all that stuff.

Whilst exploring this idea, I came across Ghost, which I had heard of before but never really looked into it. Initially seemed to be a similar platform to substack, but I thing there's a lot more to it. Here are some things that I really like about Ghost:

  1. The interface: simple and clean. It was a charm to work with from the get-go. Substack was kinda confusing, with the dashboard and your account being two different things, and another third view that is your substack page preview. In ghost previewing your pages/posts always happens in a neat little window.
  2. Easy local install: I remember that I shed many a tear trying to get Jekyll to run locally. Getting ghost to run locally took only one terminal command. I will also not miss Ruby gems and them not working half of the time.
  3. The Handle-bar syntax: similar to Jekyll ghost also has it's own handlebar syntax, with some additional functionality that I really like. For instance, the rowStart and rowEnd commands made it super easy to arrange a post list in from of a two colum layout.
  4. I don't need mailchimp anymore: now I can automatically send out an email whenever I post new content, without having to do it from another service like mailchimp. It also allows me to manage and create groups of email recipients. I haven't used it as of now but I definitely want to have that option. Even you still want to use mailchimp there's also an integration for it.
  5. Paid Memberships: at some point I want to be able to make a full-time living from the blog, having the ability to set up pay-walled content comes in handy in that scenario.
  6. 0% fees: as opposed to substack that takes a cut. Ghost I just have to pay the monthly hosting fee (which increases with more members but we'll see)
  7. Is in active development: there's new features on the horizon, there's a support forum and it overall seems like a healthy platform.
  8. Easily customisable: the ghost handlebar syntax is very similar to Jekyll's, hence it wasn't very difficult to quickly modify one of the free templates to my liking. I like being in control of the design of things, unlike on substack. On ghost you can easily add code injections anywhere on any page if you need custom behaviour.

So, now the big questions is: why not Eleventy? Hugo? Pelican? The simple answer to that; Ghost just has everything that I need, all of which comes out of the box and without requiring any wonky workarounds. Maybe in due time I will discover that Ghost has it's flaws, but we'll see!

The BIG Migration

In total it took me 8 days to migrate the blog over from the old setup to Ghost.

8 days?!

Yes 8 days.

And that's honestly much faster than I had anticipated, and I'm actually really happy with how smoothly everything went. One of the things that I was worried about the most was being able to keep my links intact for SEO purposes. Serach engines like google and web crawlers really don't like broken links...

So here's why this took 8 days:

Day 1

Figuring out ghost and how the handlerbar syntax works, messing around with one of the free templates. Just getting a feel for things, you know?

Day 2 to 4

Settling for one of the free templates and customizing it to my needs. Essentially, I wanted the blog to look fresh, but still be recognizably 'Gorilla Sun', if that makes sense? Starting with a template helps tremendously, because there's not a chance that I'd be able to put together a complete css stylesheet in just 8 days. I'm not a learned web dev, nor do I have the desire to be one... css scares me XD.

I'm versed enough though, to be able to make changes for my desired positioning and responsiveness. One cool thing I'm using on the articles page is the glide.js library. These sliding card containers are really cool, and I think they're a really neat way to show the articles!

The community tab is still a bit lacking, but it's a work in progress. Embedded tweets take so f'ing long to load that it's not funny anymore. I need to see if there's something that can be done about it, maybe caching them in some way.

Day 5

There's no easy way to import posts from to ghost other than manually copying them over. And naturally that wasn't as seamless as I had hoped, twitter embeds were copied over as blockquotes, images for the most part did copy over except when I had them inside of divs (to arrange them side by side or as galleries), code snippets didn't always copy ver correctly, custom scripts and embeds also didn't copy over.

So I went manually through 52 posts and tried to fix them as much as possible. That was a bit mind numbing; at the end I was just glad that I made it through.

Day 6

Here's what I was dreading the most, setting up the domain on ghost and changing the DNS settings in godaddy. Here's where a lot of problems can happen if not done correctly. I was expecting it to take some time and the website to be down for a while the DNS settings were propagated, but surprisingly that wasn't the case. Maybe 15 minutes later all the links were pointing to the respective pages and articles. The blog was good to go!
Ghost allows you to set routing options and permalinks similarly to jekyll, so I was able to keep the old link structure for the blog posts that looked something like this[blog-post-title]. That's one thing I really like about the ghost console, is that it makes it very easy to setup new categories and collections for different types of blog posts!

Day 7 to 8

We had a little bit of turbulence tho, something that I didn't think through ahead of time was the links pointing to assets, mainly images that I was hosting in the same github repository that netlify was building the static site from.
The images in the posts would be referred to under links that looked like this:[image-file-name].jpg netlify was taking care of delivering these images properly. But changing the domain to ghost, naturallly these links were not valid anymore and pointing to assets that simply didn't exist. Maybe I handled this in a backhanded way but since I had all the assets in a big folder on my desktop yet again I went manually through all of the posts in the ghost editor and copied the images over. Some posts took much longer than others, for example my yearly recaps as well as the genuary 2023 recap had a million pictures and links that took forever to copy over.

Settling In

Now almost one week has passed since we moved, a lot of things had to be fixed over the past week. There were some broken links, some missing texts in the blog posts, truncated code snippets, some css issues where content was larger than the screen, as well as some js bugs in the console that needed addressing. There's still a lot more to be done, but overall I feel like I'm handling it all better than I did when I started where I had no idea what I was doing.

As of now, I've returned to writing and working on new articles that I'll be posting soon. I'm excited for the future of the blog, and I'll try to keep at it as much as possible going forward! Anyway, cheers! Happy sketching, blogging and reading! See you in the next post!