My friend Eric has been working on a project called Outreach For Taiwan for the last five years. It's been a serious labor of love where he travels around to different colleges during his (very limited) vacation days, and gives talks on topics ranging from culture and identity to history and politics. Educating people about Taiwan is something that means a lot to me, so I love and support what he's doing. Recently, the project was losing momentum so I offered to be Eric's official sounding board -- a person to bounce ideas off of. Sometimes you just need an ear or someone asking you questions to stay on track. I'm not sure the project itself has benefited much from my presence, but it's been personally fulfilling to be more 'in the loop' on all things Taiwan.
Anyway, to the web development part. I wanted to experiment with Gatsby and the Netlify CMS over my holiday break and decided that creating a mock Outreach For Taiwan website would be a fun project.
I used the gatsby netlify starter and had everything running in no time. I loved Gatsby's documentation, both the quick start guide and tutorial was well-written and easy to follow. Once the starter was up, I decided it was important to import all existing Outreach For Taiwan blog posts. Don't ask me why, I think I just wanted the satisfaction of 'seeing' all the posts and my whole motivation for this was to try something new and have fun. This led to figuring out how to export wordpress posts into markdown and front matter.
And that's when I discovered this helpful tool...
SchumacherFM
/
wordpress-to-hugo-exporter
Hugo is static site generator written in golang. Wordpress is a tool for remote access to your server ;-) ❗️Contributions welcome!
WordPress to Hugo Exporter
Hugo a static site generator written in GoLang: https://gohugo.io
This repo is based on https://github.com/benbalter/wordpress-to-jekyll-exporter
Hugo Features
One-click WordPress plugin that converts all posts, pages, taxonomies, metadata and settings to Markdown and YAML which can be dropped into Hugo.
Features
- Converts all posts, pages, and settings from WordPress for use in Hugo
- Export what your users see, not what the database stores (runs post content
through
the_contentfilter prior to export, allowing third-party plugins to modify the output) - Converts all
post_contentto Markdown Extra (using Markdownify) - Converts all
post_metaand fields within thewp_poststable to YAML front matter for parsing by Hugo. - Exports optionally
commentsas part of their posts. This features needs to be enabled manually by editing the PHP source code. See file hugo-export.php at line ~40. - Export private posts and drafts. They are marked as drafts as well and won't get published…
Per the readme, I needed a local instance of wordpress on my machine to install the plugin. Since I've never setup wordpress before, I decided to go the docker route.
wodby
/
docker4wordpress
Docker-based WordPress stack
Docker-based WordPress Stack
Introduction
Docker4WordPress is a set of docker images optimized for WordPress. Use docker-compose.yml file from this repository to spin up a local environment for WordPress on Linux, macOS and Windows.
- Read the docs on how to use
- Ask questions on Slack
- Follow @wodbycloud for future announcements
Stack
The WordPress stack consist of the following containers:
| Container | Versions | Service name | Image | Default |
|---|---|---|---|---|
| Nginx | 1.17, 1.16 | nginx |
wodby/nginx | ✓ |
| Apache | 2.4 | apache |
wodby/apache | |
| WordPress | 5 | php |
wodby/wordpress | ✓ |
| PHP | 7.4, 7.3, 7.2 | php |
wodby/wordpress-php | |
| MariaDB | 10.4, 10.3, 10.2, 10.1 | mariadb |
wodby/mariadb | ✓ |
| PostgreSQL | 12, 11, 10, 9.x | postgres |
wodby/postgres | |
| Redis | 5, 4 | redis |
wodby/redis | |
| Memcached | 1 | memcached |
wodby/memcached | |
| Varnish | 6.0, 4.1 | varnish |
wodby/varnish | |
| Node.js | 12, 10, 8 | node |
wodby/node | |
| Solr | 8, 7, 6, 5 | solr |
wodby/solr | |
| Elasticsearch | 7, 6 | elasticsearch |
wodby/elasticsearch | |
| Kibana | 7, 6 | kibana |
wodby/kibana | |
| AthenaPDF | 2.10.0 | athenapdf |
arachnysdocker/athenapdf-service | |
| Mailhog | latest | mailhog |
mailhog/mailhog | ✓ |
| OpenSMTPD | 6.0 | opensmtpd |
wodby/opensmtpd |
It took a little time for me to get the instance set up because I'd never touched docker before but once it was up, exporting the posts to markdown was super straight forward. The trickiest part was realizing that I needed to zip up the files in the repo and upload it as a plugin on wordpress. I should probably submit a PR in the readme to make that crystal clear -- it seems quite obvious in hindsight but figuring that out took much longer than I want to admit.
Holiday time took over the rest of my break so that's all I accomplished. But that's ok! My goal was to get a taste of technologies I don't use on the daily, and this did exactly that. Perhaps on my next break I'll try to get further with this, or try building another mock Outreach For Taiwan site with a totally different set of tools.
Top comments (10)
Hi Jess,
Gatsby supports WordPress' as a data source (gatsbyjs.org/packages/gatsby-sourc...), so there's no need to really export anything.
Oh, awesome! That's good to know. cc @phlashgbg
Thanks for this Jess, I host a number of Wordpress sites (aka remote access services!) for friends, most of which only have occasional posts added, so I've been looking at ways to go static. This addresses one of the challenges nicely, moving existing content out; the other is getting a good update workflow for the semi-technical site admins who are used to Wordpress.. would be interested to hear more on that from anyone?
Netlify seems like a magic bullet to me. That's probably because I haven't used it enough to find it's warts, but this seems like a great use case for it!
Hi Jess, does it mean that hugo's and gatsby's formats are compatible? Nice to know!
Cool that you want to spread awareness of your heritage, that's a great thing :)
You can feed gatsby md files for sure. Those can be manually written or written by a cms, such as netlify cms
Thanks!
Awesome post I think there might be more blogs being converted from WordPress into Gatsby in the future due to the cost and maintenance of a blog.
Gatsby is awesome but you can also try frontity.org (WordPress + React)
Check out Twentynineteen porting in frontity at twentynineteen.frontity.org
is it now converted and running on gatsby ?