sesam.hu

Engineering Manager | Trail Runner | Stockholm, Sweden

Jekyll

Tuesday, 23 March, 2021 - sesam

For a while now I’ve been toying with the idea of moving the blog from its current location and leave WordPress behind in the process. The primary reason was costs: my current hosting plan amounts to $120 a year and that’s 💰 I can spend elsewhere. Another reason was speed and complexity: for my use case of personal blogging WP started to feel extremely bloated and unnecessarily slow. GitHub Pages looked like an excellent alternative. (If I remember correctly I’ve been shown Jekyll long ago back when I was in Japan but I did not understand the benefits at the time.)

Making the switch did not seem particularly complex. I followed the Installation guide and the Step by Step Tutorial. Ruby I’ve already had installed but I opted for setting up the latest 3.0.0 version with rbenv anyway. However, this broke local testing, apparently because of this bug, easily fixed by bundle add webrick.

Getting the existing 2039 posts into the new system proved to be less straightforward. I tried the Jekyll Exporter plugin, but as I expected it ran out of memory. The likely issue is that the plugin would try to include the entirety of the wp-content/uploads folder as well…

To circumvent this I made a copy of the WordPress database, fired up a local mySQL server and fed the database into it as if I had a locally running WP. Then I used the jekyll-import gem to create a dump of the posts converted into Jekyll-compatible html files. Defaults had to be changed because I didn’t use categories but I wanted to retain non-ASCII characters: "clean_entities" = false. For an unknown reason "socket" had to be explicitly set to nil for the script to be able to connect. Afterwards it ran perfectly.

❯ ruby -r rubygems -e 'require "jekyll-import";
    JekyllImport::Importers::WordPress.run({
      "dbname"         => "xxxxxxx",
      "user"           => "root",
      "password"       => "",
      "host"           => "localhost",
      "port"           => "3306",
      "socket"         => nil,
      "table_prefix"   => "wp_",
      "site_prefix"    => "",
      "clean_entities" => false,
      "comments"       => true,
      "categories"     => false,
      "tags"           => true,
      "more_excerpt"   => true,
      "more_anchor"    => true,
      "extension"      => "html",
      "status"         => ["publish"]
    })'

Then came porting the styling over and adding the jekyll-paginate plugin. I needed to employ a hack here because of the differing logic. My WordPress setting was to display the newest posts first which meant that the next ten posts on page2 would be on the previous url not on next like in Jekyll pagination. Behold the reverse logic:

<nav>
<!-- Pagination links -->
    <div class="pagination">
        {% if paginator.next_page %}
        <a href="{{ paginator.next_page_path }}" class="previous">Older</a>
        {% else %}
        <span class="previous">Older</span>
        {% endif %}
        <span class="page_number ">
        {{ paginator.page }} / {{ paginator.total_pages }}
        </span>
        {% if paginator.previous_page %}
        <a href="{{ paginator.previous_page_path }}" class="next">Newer</a>
        {% else %}
        <span class="next">Newer</span>
        {% endif %}
    </div>
</nav>

For now this qualifies as an MVP. There are several things not working yet such as commenting, image galleries, tags, video embeds, and so on, which I plan to resolve gradually.