There are a million and one blog posts for “move from WordPress to Hugo!” out there. This is the opposite of that.
Hugo is good
I like Hugo a lot. If you need a static site generator I’d recommend it without reservation! Once I had it going it worked very well. I loved how fast Hugo could build the entire site and it required almost no server resources. Turns out, you don’t need that much raw computing power to serving static files to a handful of folks every day.
But…posting was far more complex than I wanted it to be. In the end I was syncing a folder via dropbox, committing my code to a repo, pushing it to a repo on the server. From there a git hook would run to build the site and then move the files to a folder. Extremely cool and extremely obtuse. If I had just one computer it wouldn’t have been that big of a deal to continue on; however, because I’m a glutton for complication, I bounce between 5 different devices (3 macs, 2 iOS devices) within the course of a week.
Having a web interface to log into matches my mental model of “I am writing and publishing” much better. I also dearly appreciate having drag and drop image support as well as WYSIWYG formatting options. Hugo’s support for non-text media is lacking. That’s totally okay! But, I was finding that I was avoiding publishing certain kinds of posts because I was lacking easy tools to do so.
WordPress and Gutenberg
What finally pushed me to make this change was a recent experience building a new website for Workantile. During that redesign we relied on the Gutenberg editor for formatting our pages. I was impressed! You can create fairly complex pages quickly with blocks in a way that just wasn’t easily doable a few years ago without diving deep into theme files. We’re in a bit of a rough transition point going from the classic editor to Gutenberg (and more importantly the concept of Blocks). It’s getting better all the time though!
The move went pretty well for the most part. Some technical issues I ran into:
The RSS importer that is built into wordpress needs some serious attention. The biggest issue is that it fails because it’s calling a deprecated PHP function. The fix for this for me was to comment out the offending line. This StackOverflow post was helpful:
php – Call to undefined function set_magic_quotes_runtime() – Stack Overflow
I just found line 72 in the importer and commented it out. I wouldn’t rely on this edit for an import where you didn’t control all of the content, or as an importer you run more than once. It’s a brittle fix to say the least. Here’s the error and stack trace:
An error of type E_ERROR was caused in line 72 of the file /var/www/beta.chrissalzman.com/wp-content/plugins/rss-importer/rss-importer.php. Error message: Uncaught Error: Call to undefined function set_magic_quotes_runtime() in /var/www/beta.chrissalzman.com/wp-content/plugins/rss-importer/rss-importer.php:72
#0 /var/www/beta.chrissalzman.com/wp-content/plugins/rss-importer/rss-importer.php(178): RSS_Import->get_posts()
#1 /var/www/beta.chrissalzman.com/wp-content/plugins/rss-importer/rss-importer.php(204): RSS_Import->import()
#2 /var/www/beta.chrissalzman.com/wp-admin/admin.php(344): RSS_Import->dispatch()
Hugo’s RSS Implementation
And on the Hugo end of things: Hugo’s built-in RSS generator doesn’t include the full text of the posts. It also doesn’t include categories. I happen to be the sort of person who likes adding categories, so this was a problem! Here’s a gist of my RSS theme file that has the full text and categories:
Hugo RSS Implementation with Categories · GitHub
This looks for the categories set in the frontmatter of your markdown files. If there are none it skips it and nothing is added to the feed for that post.
I wanted to make sure anyone who subscribed to my old RSS feed continues to get the new one. To do so I set up a 301 redirect using this plugin:
Simple 301 Redirect
Keeping it around since it’s always nice to have this in a readily accessible place.
Moving images over to the new site involved making sure they were uploaded appropriately to WordPress’ Media library. I toyed with the idea of doing one big import and going through and fixing individual images. Then I found this plugin that just did it for me. Installed it and then Edited all of my posts and resaved them. It ran through and copied everything over and updated the src tags for me:
Auto Upload Images – WordPress plugin | WordPress.org
Inserting images in Hugo was one of the reasons I wanted to get away from it so this was nice to have it just work. After I ran this I turned it off.
So far, so good. I’m happy with this and this post was fully written and edited in the WordPress editor. It’s nice to have “my website” compartmentalized to something I go to on the internet to edit, although I will miss how much posting a blog post made me look like I was attempting to hack the planet.