While going through some old posts, tidying things up a bit, I have missed the Wordpress Edit link on pages and posts. This got me to thinking, could I emulate this in Hugo?

Turn out, yes you can and fairly easily.

First off, I edited my themes’ layout for a single post, which for me was single-content.html, I then figured out where I’d like the edit link and added this bit of template code:

    {{ if .Site.IsServer }}
        {{ partial "edit" . }}
    {{ end }}

The if around the partial means only include this if we are running hugo in development mode.

The next task was to make the edit.html partial:

{{ if .Site.Params.baseDir }}
<a href="vscode://file{{ .Site.Params.baseDir }}/content/{{.File.Path}}">Edit</a>
{{ end }}

I defined Params.baseDir in my sites’ config.yaml, which means I won’t have to alter the theme if I alter where I’ve got the git repo checked out. This needs to be the full path to the root of your site (i.e. the path to the dir with config.yaml in it.).

The vscode://file is specific to Microsoft Visual Studio Code, which is my preferred editor, that will likely need adjusting if you use something else.

Footnote

I tried to make the template read the editor specific bit of the url from the config.yaml, but whenever I did that the dev mode got in the way and mangled the url from:

vscode://file

to

http://localhost:1313/.....

Which isn’t helpful. I’ve not figured out a way of fixing this as yet, so that portion of the edit link is hardcoded into the template.

After many years of using Wordpress to host this site I have grown tired of its resource consumption and the constant need to keep it updated. When it came to put my CV online (here) I tried out Jekyll which worked out pretty well, I write a lot of Markdown for work, and while it has its faults I’m pretty happy with it over the alternatives.

False Starts

This lead to thoughts of moving this site to Jekyll. After a bit of faffing around I ended up with a fairly complete export from wordpress - although weirdly and for no reason I could find about 10 pages failed to export. I found a nice enough theme (Centrarium) which suited my needs and it all looked ok, sure there was plenty of tidying up to go, but on the whole it was ok.

The biggest annoyance were the build times, on my 2015 MacBook Pro they ran to anywhere between 5 and 7 minutes! :(

The other annoyance was I couldn’t find any nice photo gallery plugin, I’ve got a whole bunch of photos (mostly of models) on this site and I wanted to keep them. I toyed with the idea of moving them all to Flickr however with the recent SmugMug aquisition I didn’t want to sink a whole bunch of time into moving everything over, only for SmugMug to change the terms, or make it paid for only. I should point out I think SmugMug is a great home for Flickr, and I hope they reinvigorate it after many years of neglect under the hands of Yahoo. I’ll keep an eye on how things are panning out over there and maybe move my imagery over at some point in the future.

While searching for a gallery plugin, I found this plugin for Hugo, it looked pretty good and did what I wanted really simply. The problem was I was using Jekyll and this was for the fairly new competitor on the static content scene, namely Hugo.

Second attempt

So, maybe I should look into Hugo. After a bit of fooling around I managed to get the Jekyll export from Wordpress up in Hugo. The first thing I noticed was rebuild times were quick, like really quick. It was down from the 5+ minutes with Jekyll, to between 5 and 10 seconds:

% hugo

                   |  EN
+------------------+------+
  Pages            | 1347
  Paginator pages  |  277
  Non-page files   |    0
  Static files     | 1991
  Processed images |    0
  Aliases          |  346
  Sitemaps         |    1
  Cleaned          |    0

Total in 5587 ms

So that sort of made up my mind, it was far quicker, there was a nice gallery plugin and being in Go it made things easier from a dependancy point of view. The only problem was I liked Centrarium and couldn’t find a Hugo theme similar. Reading into theme development a bit I started to realise I could probably port the theme to Hugo in a couple of hours. Turns out that was about how long it took. I didn’t port 100% of the functionality in the original, just the bits I use. If anybody wants a copy I’d be more than happy to put it on Github and attempt to port the rest of the features.

So this is the first post on the new blog, its all in git (apart from the photos) and I’m much happier with it.

At the same time as migrating I also took the oportunity to move it all to an S3 bucket, fronted by CloudFront so I can have SSL and my own domain. I’m not sure how the cost of that will work out, but I’ll keep an eye on it. If it isn’t too much it’ll stay like that, otherwise it’ll be back to Nginx on my virtual server.

Comments

The only thing feature wise, missing from my Hugo rig is comments, I never got many comments anyway so I’ve deprioritised them somewhat, maybe one day I’ll get round to plugging in Disqus or something.

Until then, my email address is in the footer, please feel free to email me if you have any questions or want to chat about something.

Work in Progress

The biggest breaking change from the migration was the photos. I’m working my way through fixing them, starting with the top 50 posts, I’m about a quarter of the way through by now.