Home > Shopify Development > Estimate Reading Time of a Post

How to Estimate the Reading Time of a Post in Shopify

Sam Updated: February 19, 2024

Drive 20-40% of your revenue with Avada

Get Started

The feature estimated reading time of a post is becoming more popular. Reading time is grounded in the average speed of reading of a grown-up (about 265 words per minute). The total word count of a post will be translated into minutes with an adjustment made for photos. There are a lot of elements that could lay effects on reading time, like the type of font, sizes, the viewer’s age, reading material (on paper or a monitor), the total number of paragraphs, links, images in the content, and so many more.

If you are in need of deploying at GitHub pages, you are not able to use the Jekyll plugins because GitHub will run with the --safe flag. To address the issue, we did create a snippet of pure Liquid.

Related Posts:

However, please keep reading our instructional writing on how to estimate the reading time of a post to find out the solution.

How to estimate the reading time of a post

Step 1: Get the word count
Step 2: Configure

Step 1: Get the word count

To get started, we need to get the word count:


{% assign words = content | number_of_words %}

Step 2: Configure

In this step, we need to divide the number with something called word per minute (WPM). Referred to Wikipedia’s document, a grown-up can read about 180 words per minute in a PC monitor. It’s easier to do the rest now:


{{ words | divided_by:180 }} mins

The problem is what would happen if there are less than 180 words in the post?

The fact is that even there are more words, 350 words, for example, when it’s divided by 180, the result we get is 1.94 and Liquid will finally round it down to 1. As a consequence, the viewer will see “1 min” that does not seem right. To solve the problem, we need to check whether it has less than 360 words because any number equal or greater than 360 will result in “more than 2 minutes”.

Actually, it is quite simple to get it done:

{% if words < 360 %}
  1 min
{% else %}
  {{ words | divided_by:180 }} mins
{% endif %}

To get it done, I put it in the _includes/read_time.html with the following content:

<span class="reading-time" title="Estimated read time">
  {% assign words = content | number_of_words %}
  {% if words < 360 %}
    1 min
  {% else %}
    {{ words | divided_by:180 }} mins
  {% endif %}
</span>

Then, you just need to include it in the post layout _layout/post.html:


{% include read_time.html %}

Conclusion

This is the end of the instruction, hope that we have brought you the key to your success! If you want more helpful information, we have many other posts on catalog that we can check out. Or if you really want to dive in, our Shopify Custom App Development Tutorials are always there for you.

Catalog

How to modify the shipping calculator HTML How to add the gift-wrapping snippet in your cart template How to modify your theme.liquid file How to insert some JavaScript to your theme Delete the author's name in your theme Insert the search box on your Jekyll site using lunr.js Liquid Variables: assign, capture, increment, increment Liquid paginate: Split into multiple pages Update the product form to support dynamic checkout buttons Select which page to show when customers log in to your online store Modify the code for your payment icons Insert the security badge code to your theme Insert Disqus to your blog Insert breadcrumb navigation to your store Generate your snippet generate the "How did you hear about us" form field Generate and include an age-check snippet Generate a back-to-the-top snippet Edit correct quantities on the cart page silently Apply a class to your templates Update item quantity fields in the cart Update the collection-template.liquid file Modify the theme code to add the shipping calculator Insert the notification form code to your theme Insert custom fields to your theme's customer registration form Add Custom Fields to Contact Form in Shopify Insert a form field to your theme code Insert a Continue shopping link to your cart page Insert a checkbox to your cart page in sectioned themes How To Create A Contact Page On Shopify: Our Step-by-Step Guide

Sam Nguyen

Sam Nguyen is the CEO and founder of Avada Commerce, an e-commerce solution provider headquartered in Singapore. He is an expert on the Shopify e-commerce platform for online stores and retail point-of-sale systems. Sam loves talking about e-commerce and he aims to help over a million online businesses grow and thrive.