I wanted something more optimized on the web and that means static site generators are the way to go. WordPress has it’s own security issues and static site is close to impenetrable. Do note that I am not using much of the advance features of WordPress such as gallery creation and the well-crafted SEO plugins available. I really didn’t have much to lose when I migrate to another tool.
I have been using Hugo for at least 3 months now. I am impressed by the amount of time required to generate my content. Using Hugo allows me to manage my content via Github and that’s a huge plus for me. The plan is to migrate my blog for more than 1000 posts over.
The Netlify advantage
This isn’t sponsored by Netlify but using Netlify together with Hugo is such a time-saver. I first heard of Netlify at a JAM Stack workshop in Google LaunchPad (San Francisco) and gave it a try. Netlify handles the deployment for you and puts your file in the CDN. If you don’t need extra multiple user support, you’re good for the free tier.
The actual migration
Installing the plugin
To install, go to the Github page and click on the green “Clone or download” button and then click on “Download ZIP.”
Once you’re done, go to your WordPress Admin page and click on Plugins -> Add New. On the top, there “Upload Plugin”. Upload the ZIP file you have just downloaded. If the upload fails, check that you granted the correct permissions in your web server’s
Installing plugin prerequisites
Not that the plugin uses a PHP class called ZipArchive which is not installed by default. If you’re using PHP 7.0 like I am, you need to run:
sudo apt-get install php7.0-zip
If you have PHP 7.1 or PHP 5.6 instead, use one of these:
sudo apt-get install php7.1-zip sudo apt-get install php5.6-zip
If you’re using Docker php ext:
If you’re using Apache’s PHP module, be sure to restart Apache HTTPD:
sudo service apache2 restart
Disable Jetpack’s Image Performance
Make sure you turn off Jetpack’s Image Performance feature which uses the CDN. This changes your WordPress images URL to the ones in WordPress’s CDN. I doubt you will want that.
Exporting to Hugo
Phew, that’s a bit of work. Now go to your WordPress Admin again and activate the plugin you have just installed.
Then you can see a new menu item in Tools -> Export to Hugo.
Clicking on it will give you the file
What’s in hugo-export.zip
This is a sample of how my blog structure looks like:
drwxr-xr-x@ - kahwee 1 Sep 19:39 about .rw-rw-rw-@ 80 kahwee 2 Sep 2:39 config.yaml drwxr-xr-x@ - kahwee 1 Sep 19:39 contact drwxr-xr-x@ - kahwee 1 Sep 19:39 post drwxr-xr-x@ - kahwee 1 Sep 19:39 resume drwxr-xr-x@ - kahwee 1 Sep 19:39 wp-content
All my posts are inside
post, there are more than 1,500 files extracted.
The images in
wp-content are also extracted out for you:
└── wp-content └── uploads └── 2015 ├── 07 │ ├── 5164-1024x615.jpg │ ├── 5164-150x150.jpg │ ├── 5164-300x180.jpg │ ├── 5164-825x510.jpg │ ├── 5164.jpg
These files are meant to be in the
I also have existing comments and I wanted to move them over to disqus. Hugo doesn’t have a commenting feature.
Note that users online are complaining that the plugin is malicious and that it made your WordPress blog really slow:
This plugin will change most of the affiliate links on your website and I have articles completely seized by Disqus. So, if you have an affiliate-based website, by installing this plugin, you basically give up your incomes to them. No, they didn’t add links in comments, I repeat, they changed the existing ones to their own!
With that in mind, you should only do this as a last step, right before you are going to delete your blog.
Installing the plugin is relatively straight forward, once you have that activated, you can go to Comments -> Disqus, under “Import and Export”, click on button that says “Export comments to Disqus”.
Here’s a sample segment for what it has exported. I am incredibly thankful this worked out. My tags, categories and URLs are preserved too:
--- title: How to install Composer in Windows author: kahwee type: post date: 2013-01-05T16:20:14+00:00 url: /2013/install-composer-windows/ categories: - Code tags: - command prompt - composer - console - how-to - php - php cli - postgresql - tip - windows - windows 7 - xampp
I used a WordPress plugin called Crayon Syntax Highlight which doesn’t export correctly. It looks like this now:
[code language=”bash”]C:Program FilesCommon FilesMicrosoft SharedWindows Live;C:Program Files (x86)Common FilesMicrosoft SharedWindows Live;C:Program Files (x86)NVIDIA CorporationPhysXCommon;%SystemRoot%system32;%SystemRoot%;%SystemRoot%System32Wbem;%SYSTEMROOT%System32WindowsPowerShellv1.0;C:Program Files (x86)Windows LiveShared;C:Program Files (x86)SproutCorebin;N:vagrantvagrantbin;C:Program Files (x86)QuickTimeQTSystem[/code] Append your XAMPP PHP directory at the back of what is already there: [code language=”bash”];C:xamppphp[/code]
A little disappointed there but they are really old tutorials and aren’t relevant anyway.
The plugin converted my HTML to Markdown which is very nice. I will say it works mostly well with these tiny omissions:
- Smart quotes:
And you’re doneshould have been
And you're done
- Smart quotes:
“should have been
—should have been an em dash
–should have been an en dash
imgtags don’t get converted
Moving to Hugo gave me a chance to clean up all the blog posts that are completely outdated and non-meaningful. I want to keep my blog up to date instead of just churning out hundreds of posts of low quality.