How to Display Reading Time for WordPress Posts: A Beginner’s Guide to Creating a Plugin

WordPress is a popular content management system (CMS), but it can be limiting as a blogging platform without the use of plugins. Therefore, we’ll create a small plugin in this post that displays the reading time for an individual post. This is one of the assignments for a course I teach that was creating the reading time using custom fields. Thus, I decided to create a short plugin to show how easily WordPress could be customized with plugins.

Before we start, let’s set some assumptions that will make development easier. First, the average reading time is 250 words per minute. Second, if the article has fewer than 250 words, it will be considered one minute long. Third, we will round the reading time to the nearest minute. And finally, you need a working WordPress installation to install and activate the plugin.

Now, let’s create the plugin. First, navigate to wp-content/plugins/ in your hosting or local WordPress installation, and create a folder named “aw-reading-time”. We’re using the “aw” prefix (AdmixWeb) to avoid naming conflicts with other plugins.

Next, create a PHP file within the aw-reading-time directory with the same name: aw-reading-time.php. This file will contain the functionality of the plugin. You can use as many files as you need within the directory, but for this plugin, one file is enough.

Copy and paste the following code into the aw-reading-time.php file:

<?php 

/**
 * Plugin Name: Reading Time
 * Plugin URI: https://wp.me/p5Q30k-mg
 * Description: Display the reading time for posts and pages.
 * Version: 0.1
 * Author: Teylor Feliz
 * Author URI: https://admixweb.com/
 **/

if (!class_exists('AW_ReadingTime')) {

  define('AVERAGE_WORDS_PER_MINUTE', 250);

  class AW_ReadingTime
  {
    //Initiates the plugin
    public static function init()
    {
      //Uses the add_filter to get the content and pass it to the display function
      add_filter('the_content', 'AW_ReadingTime::display');
    }

    //displays the reading time with the minutes
    public static function display($content)
    {
      //gets the number of words in the post
      $wordCount = str_word_count($content); 
      //Calculate how many minutes it takes to read it
      $minutes = ceil($wordCount / AVERAGE_WORDS_PER_MINUTE);
      //Prepend the reading time to the post so it is displayed at the top. 
      return "<p>Reading Time: {$minutes} minute" . ngettext('', 's', $minutes) . $content; 
    }
  }

  //Initiate the code
  AW_ReadingTime::init();
}

The code starts with the WordPress header comment, which provides information about the plugin to WordPress. This allows WordPress to display the plugin on the Plugins page in the WordPress admin. Don’t forget to click “Activate” to enable the plugin on your site.

Activate Plugin in WordPress Dashboard

Next, the code checks if the AW_ReadingTime class exists to prevent naming conflicts with other files. Then, a constant is defined for the average words per minute. It’s good practice to use constants instead of variables for values that won’t change during the program’s lifespan.

if (!class_exists('AW_ReadingTime')) {

  define('AVERAGE_WORDS_PER_MINUTE', 250);

}

Finally, the AW_ReadingTime class is created with two methods: init and display. The display method finds the number of words in the post using the str_word_count() function and calculates the number of minutes it will take to read the post on average using the ceil() function. It then prepends the reading time to the post content so that it’s displayed at the top of the post. Don’t forget to add the AW_ReadingTime::init() line so the code of the class is executed.

 class AW_ReadingTime
  {
    //Initiates the plugin
    public static function init()
    {
      //Uses the add_filter to get the content and pass it to the display function
      add_filter('the_content', 'AW_ReadingTime::display');
    }

    //displays the reading time with the minutes
    public static function display($content)
    {
      //gets the number of words in the post
      $wordCount = str_word_count($content); 
      //Calculate how many minutes it takes to read it
      $minutes = ceil($wordCount / AVERAGE_WORDS_PER_MINUTE);
      //Prepend the reading time to the post so it is displayed at the top. 
      return "<p>Reading Time: {$minutes} minute" . ngettext('', 's', $minutes) . $content; 
    }
  }
  //Initiate the code
  AW_ReadingTime::init();

That’s it! Your plugin is now ready to use.

Teylor Feliz
Teylor Feliz

Teylor is a seasoned generalist that enjoys learning new things. He has over 20 years of experience wearing different hats that include software engineer, UX designer, full-stack developer, web designer, data analyst, database administrator, and others. He is the founder of Haketi, a small firm that provides services in design, development, and consulting.

Over the last ten years, he has taught hundreds of students at an undergraduate and graduate levels. He loves teaching and mentoring new designers and developers to navigate the rapid changing field of UX design and engineering.

Articles: 182