In the beginning of 2020, I started a goal of writing more professionally. I did not like the idea of putting my blog articles in pay-wall sites such as medium, so I decided to use my own static site generator and host my blog in GitHub pages.

In picking a static site generator, I have poked around at a few libraries out there, and landed on Pelican. This, in retrospect, was an obvious choice because among the Python static generators (pelican, lektor, nikola), pelican has been around for a long time, and has an extensive plugin system.

The plugin I want to talk in this post is the readtime plugin. From the plugin's own site:

An article estimated read time plugin for Pelican static site generator. After Pelican generated the content of each page, the plugin read through the generated HTML content and strip all the tags, count all the word, then utilize average human read speed to calculate the read time of each article. The read time is passed over to the 'content' object of the article so Jinja template can use it to display the read time on wherever appropriate.

It's a short and sweet plugin, but it took some time to make it work with my site. So I figured that I'll writeup what worked for me, in case it helps others in the future.

First, I have added plugin name to the pelicanconf.py file:

PLUGINS=[ ... , 'pelican-readtime']

Then, you can put the following code in whichever template you want. I was using pelican-bootstrap3 template, so I put the following code block in my article_info.html:

{% if article.readtime %}
    <span class="label label-default">Read time</span>
    <span class="published">
        <i class="fa fa-hourglass"></i> {{article.readtime.minutes}} min.</span>
{% endif %}

I also added the following code block to archives.html:

{% if article.readtime %}
    <span class="categories-timestamp">({{article.readtime.minutes}} min read)</span>
{% endif %}

And that's all there is to it! After you had the readtime properly configured, you will be able to see the read time of your articles in the article page:

readtime-article-page

... as well as the archive page:

readtime-article-page

Comments

comments powered by Disqus