Hexo Draft Tags

A draft table with a man's hand holding a pencil over a piece of draft paper. A metal ruler is in the foreground. Photo by Daniel McCullough on Unsplash.

I’ve been using Hexo to create websites, including this one, for some time. It allows me to write posts in markdown and then have them render into the website automatically.

Hexo allows for third-parties to create plugin to extend it’s functionality. One feature that I noticed was missing was the ability to hide text from being rendered in production mode if it wasn’t quite completed yet. By default you can mark an entire post as a draft, which means that it will show when running with the --draft option and not in production, but you can’t exclude part of a post.

To fix this I created hexo-draft-tags, a very small plugin that defines tags to exclude blocks of text from the production rendering of your website.

For example:

# Post title

This text should be shown in --draft mode and in production.

{% draft %}

This text should only be shown in --draft mode.

{% enddraft %}

The plugin is available on npm here and the source code can be found on my GitHub here.