Display Estimated Reading Time in Joomla Articles

Long articles scare readers away when they can't tell how much time the page will cost them. A small "6 min read" line under the title sets that expectation and keeps people scrolling. Showing a reading time in Joomla usually means installing another plugin that you then have to keep updated. You can add it with one PHP snippet in Code Snippets.

The PHP snippet code

When Joomla prepares an article, the snippet counts the words in its body, divides them by your reading speed, and adds a reading time line at the top of the article. It runs on single article pages only, so blog and featured lists stay as they are.

use Joomla\CMS\Factory;

// Average reading speed in words per minute.
$wordsPerMinute = 200;

// Text shown after the number, for example "6 min read".
$label = 'min read';

// Do not edit below.

$app = Factory::getApplication();

$addReadingTime = function ($event) use ($app, $wordsPerMinute, $label)
{
    // Run on the single article view only.
    $input = $app->getInput();

    if ($input->getCmd('option') !== 'com_content'
        || $input->getCmd('view') !== 'article')
    {
        return;
    }

    $arguments = $event->getArguments();
    $context   = $arguments['context'] ?? $arguments[0] ?? '';
    $article   = $arguments['subject'] ?? $arguments[1] ?? null;

    if ($context !== 'com_content.article'
        || !is_object($article)
        || empty($article->text))
    {
        return;
    }

    // Never process the same article twice.
    if (!empty($article->readingTimeAdded))
    {
        return;
    }

    $text    = trim(strip_tags($article->text));
    $words   = preg_split('/\s+/u', $text, -1, PREG_SPLIT_NO_EMPTY);
    $minutes = max(1, (int) ceil(count($words) / max(1, $wordsPerMinute)));

    $article->readingTimeAdded = true;

    $badge = '<p class="tcs-reading-time">' . $minutes . ' ' . $label . '</p>';

    $article->text = $badge . $article->text;
};

$app->registerEvent('onContentPrepare', $addReadingTime);

Change $wordsPerMinute to match your readers, and $label to change the text after the number. At 200 words per minute, a 1,500-word article shows "8 min read".

In Cassiopeia the line appears right under the article details. To style it, add a CSS snippet that targets .tcs-reading-time, for example with a smaller font and a grey color.

How to add this snippet

1. Install Code Snippets if it isn't installed already.
2. Log into your Joomla backend.
3. Go to Components → Tassos Code Snippets.
4. Click New.
5. Enter a title, for example Reading time.
6. Set Code Type to PHP.
7. Set Insertion Method to Auto-Insert Locations.
8. Set Location to On Page Load.
9. Paste the code above into the editor.
10. Click Save & Close.

Check that it works

1. Open a long article on your site.
2. Look at the top of the article text.

You should see a line like "8 min read". Blog and featured pages don't show it.

To link @mentions in your articles to X profiles, see Automatically Link Twitter (X) @mentions in Joomla Articles. To learn more about how PHP snippets work, read the PHP snippet docs.