I moved from WordPress and survived! Here’s how.
Photo by Mantas Hesthaven on Unsplash
Back in 2015 I decided to start my own blog. At the time I wanted something easy to use and free of ads, so I went with WordPress.com (via a company called Automatic), purchased a domain, picked a theme and started writing.
The service has been great - works well, constantly improves, feature rich. But it always bugged me I was paying about $130 USD a year (especially as the exchange rate got worse). I sucked it up last year but now I finally decided to take the plunge and get it done.
I had a few goals for my blog:
- Free (well, aside from the domain)
- I want to control my domain. It was tied up as part of WordPress
- Minimize impact. I want my URLs to continue to work as other sites link to my blog
- Static site, with all the goodness that provides
- No cookies. No Google Analytics
- Would like some basic stats. Decided I’d be happy with stats from Cloudflare
Step 1 - move my domain
I bought my domain through WordPress.com. There was a mechanism to allow me to transfer my domain so I moved it to Cloudflare. That was relatively painless.
Big benefit there is it’s wholesale prices, it’s handles all things DNS and gives me a bunch of extra functionality incase I need it.
The problem with this is that, while I setup all the DNS entries, WordPress later demanded I change the name servers. I can’t do that in Cloudflare without paying for a different tier so I created a rule, in Cloudflare so that anything coming from
liftcodeplay.com went to
liftcodeplay.wordpress.com. This worked well.
Step 2 - What tool or framework?
There are heaps out there! I chose Hugo
- It’s easy to use
- Provides heaps of themes
The last point was especially important as I quite liked my current WordPress theme and… because I suck at CSS, UI and UX.
I chose the Hugo Swift Theme. It was close to what I had… but not quite. My site was a bit simpler and had three posts per row.
The theme made use of SASS, which meant I had to install the Hugo Extended. I’m on Windows and it was easy to download and install
choco install hugo-extended -confirm
Going back to theme: I managed to tweak it get it closer to my current look and feel. It’s not as fancy as what I had but it will work nicely.
Step 3 - Hosting provider
So many options! I decided to go with Netlify as I had little experience with it and it would be free.
Setting up the site was a piece of cake: I hooked up my repo, in Github, and got it all working pretty quickly.
I was also able to setup the DNS to point to Netlify but I later removed it, to do as a final step.
There was only one thing that caught me out. In the Environment part of the Build & deploy I had to specify the Hugo Version. Easy enough… but the thing that caught me out was I had to specify a very precise version i.e. I’m on v0.72 but in the UI I had to type 0.72.0, with the .0 at the end.
Step 4 - Migrating my content
Turns out I had 87 blog posts plus 3 pages. That’s a fair bit of content!
At first I tried to copy and paste the content and the images. It was painful but gave me some practice with markdown.
I later discovered this blog post.
Export Part 1 - Exporting from WordPress
I went in WordPress Admin > Tools > Export and selected Export All
I saved this file as export.xml
Export Part 2 - Cloned the repo
Cloned the repo and put the export.xml in the root of the directory.
git clone https://github.com/lonekorean/wordpress-export-to-markdown
Export Part 3 - Converting WordPress to Markdown… with a bit of manual work
The tool worked well. The posts were Markdown and the images downloaded… but it wasn’t perfect. For example:
- I wanted each post to list the author. It didn’t
- It could create sub folders by year and month… but not day
- My Gists were being displayed as a link
- The banner image for each post was in the wrong directory
- Tags didn’t get exported
I went into the code and extended it. It fixed the first two and the remainder I solved by hand.
Step 5 - Building my pages
I had some pages - About and Talks. I recreated those by hand and tidied it up a bit. I don’t recall the tool offering to export my pages.
Step 6 - Testing, tweaking the UI
My primary concern were my recent posts from this year
I noticed the conversion process didn’t work well for my oldest posts, from 2015. I chose not to care. Content is all there it’s just the formatting that was off.
I was also able to confirm that everything looked in terms of Netlify and deployments.
Step 7 - Comments
A downside of the migration is I lost all the comments from users. There could be some good discussion. I decided I was ok with this but I wanted a mechanism for people to write comments.
There was a service called Staticman that came with the theme but I couldn’t get it setup.
I was recommended utteranc.es and went with that. It was easy to setup.
Step 8 - Go Live!
The DNS entries for the site were all good to go. Had been days earlier but there was a rule that forwarded traffic to WordPress. I disabled the rule and I was all done - it worked!
Reviewing my goals, I achieved everything. Quite happy with the outcome as the process of blogging is so much better.
I wrote all this in Visual Studio Code with preview enabled plus
hugo server running so I had a hot loading, local view of my blog. In a moment I’ll deploy by pushing a commit to
master and I’ll be done.