DEV Community

Supun Kavinda for HYVOR

Posted on • Originally published at talk.hyvor.com

Migrating from WordPress to Jekyll in 3 Steps

So, you are here because you need to migrate from WordPress to Jekyll. You are at the right place! I’ll explain to you how to do that in just 10 minutes!

Why Jekyll over WordPress?

The main reason is cost. When using WordPress, you have to pay for a domain, hosting, developers (if something breaks and you aren't a dev), plugins, etc..

In Jekyll (with Github Pages), you'll only need to pay for a domain which is around $10 per year.

Github Pages allow you to host a Jekyll blog for free forever. So, no paying for hosting.

Then, the most important feature of static sites is the speed. In Jekyll, you can get a 100/100 lighthouse score anytime with almost any plugin installed because there are no database interactions, and all the content is preprocessed and saved as HTML files. And, Jekyll will only make a minimal amount of HTTP requests (It's very small compared to a WordPress site with several plugins). Hence, it's super fast.

Nevertheless, you'll miss some amazing features WordPress offers such as web-based dashboard, adding features without code, etc. I know you are fine with that: That's why you reached this post on how to migrate from WordPress to Jekyll.

Let's Migrate from WordPress to Jekyll

  1. Export WordPress posts and import to Jekyll
  2. Export WordPress comments and import to Hyvor Talk
  3. Point domain to Github Pages

Step 1: Export WordPress posts and import to Jekyll

The first thing you have to do is exporting your current posts and pages and import them to Jekyll. There are two ways to do this.

  1. Export in Jekyll format (Markdown) and add them to Jekyll
  2. Export in WordPress format and import to Jekyll

Method 1

Here, we will use the Jekyll Exporter WordPress plugin. Install that plugin and activate it. Then, click Tools -> Export to Jekyll in the WordPress dashboard and download the .zip file.

It will contain 3 folders and several files.

_drafts/
_posts/
wp-content/
_config.yml
...
Enter fullscreen mode Exit fullscreen mode

Copy the _posts and wp-content folders to your local Jekyll site folder. The wp-content folder contains the media files of your site. URLs won't break if you add it to the root of the Jekyll site as posts will contain relative URLs.

Didn't install Jekyll yet? See how to set up a blog with Jekyll and Github Pages. It will help you understand how Jekyll works.

Method 2

While the above method is valid and accurate, you have to depend on a non-official plugin. If, in any case, the plugin doesn't work, you can use the second method: Export posts in the WordPress format (WXR) and import it to Jekyll.

If you have installed WordPress locally, you can import the posts into Jekyll with one command using a database connection. However, it's not the case for most of the websites as they are hosted in the cloud. Therefore, we can use the WordPress export tool to export comments.

See How to Import Posts from a WordPress site? for more details.

Step 2: Export WordPress comments and import to Hyvor Talk

Jekyll doesn't use databases. Therefore, after migrating to Jekyll, you can use Hyvor Talk as the commenting platform (Already used Hyvor Talk on WordPress? You are lucky. You just have to add the correct IDs to each page). You can import your WordPress comments to Hyvor Talk in a few clicks.

  • Go to Tools -> Export in the WordPress admin panel
  • Choose posts, click Export, and download the file.
  • Then, go to Hyvor Talk console's import section and choose WordPress.
  • Upload the file and click Import.

See the official docs on how to import comments from WordPress to Hyvor Talk.

To install Hyvor Talk on Jekyll, get the manual installation code from the console and add it to the Jekyll template. If you need help with it, see how to set up Hyvor Talk comments on Jekyll.

Once you finish those two steps, try to serve or build the website locally. If you encounter errors, you have to fix them manually. Jekyll will exactly show where the errors are. For example, some non-ASCII characters in the file can cause errors. Jekyll will show the file names and line numbers of the error. You'll need to remove them manually.

When the local build is successful, commit and push the changes. Make sure everything works fine on your .github.io domain.

3. Point Domain to Github Pages

The domain used for your WordPress site is now ready to be pointed to our new Jekyll site, given that your github.io website works fine.

First, you'll need to add a file named CNAME to your Jekyll site with your domain name.

example.com
Enter fullscreen mode Exit fullscreen mode

Now, go to your DNS zone of the domain and add an A or CNAME record (I suggest A) pointing to your github.io domain or its IP address.

See Configuring Custom Domains on Github Pages for more details on this. It gives the correct IP addresses of Github Pages.

Note: DNS changes take time to propagate due to DNS caching.

Yay! You are now moved from WordPress to Jekyll!

Conclusion

This tutorial showed you how to migrate your WordPress posts and comments (other metadata are automatically migrated) to a Jekyll site. Finally, we made the website online via our domain we used for the WordPress site. If you run into problems with this procedure, please comment below.

Some tips:

  • Don't delete the WordPress site until at least 30 days because your new blog may be missing some essential parts of the website. If you notice that, you can migrate back to WordPress by just changing the domain.
  • Customize Hyvor Talk comments to make it feel like a part of our website, not a plugin !😊

Good luck with your new Jekyll site. Thank you! ✌

Top comments (0)