How to Add Estimated Reading Time in WordPress (3 Easy Methods)

Estimated reading time helps visitors gauge how long an article will take to read, improving user experience and engagement. Here are three simple ways to add it to your WordPress posts:

Method 1: Using a Plugin (Easiest)

Recommended Plugins:

1. Reading Time WP (Lightweight, customizable)
2. WP Reading Time (Supports Gutenberg & Classic Editor)

Steps (Using Reading Time WP):

1. Install & activate the Reading Time WP plugin
2. Go to Settings → Reading Time WP
3. Customize:

   • Position (Before/After Content)

   • Label (e.g., “Reading Time: 5 min”)

   • Words Per Minute (Default: 200-250)

4. Save changes – it will now appear automatically. Our YouTube channel; https://www.youtube.com/@easythemestore

Method 2: Manual Code Snippet (For Customization)

Add this to your functions.php (Child Theme recommended):

function reading_time() {
    $content = get_post_field('post_content', get_the_ID());
    $word_count = str_word_count(strip_tags($content));
    $reading_time = ceil($word_count / 200); // Adjust 200 to your WPM
    
    echo '<div class="reading-time">Estimated reading time: ' . $reading_time . ' min</div>';
}
add_shortcode('reading_time', 'reading_time');

To display it:

• Use the shortcode [reading_time] in posts
• Or add <?php reading_time(); ?> in your single.php

Method 3: Using a Block Editor (Gutenberg) Plugin

• Block Visibility (Add conditions)
• Kadence Blocks (Custom HTML block)

Steps (Using Kadence Blocks):

1. Add a Custom HTML Block where you want the reading time
2. Insert this JavaScript:

<script>
document.addEventListener('DOMContentLoaded', function() {
    const content = document.querySelector('.entry-content').textContent;
    const words = content.trim().split(/\s+/).length;
    const time = Math.ceil(words / 200);
    document.getElementById('reading-time').innerHTML = '⏱️ ' + time + ' min read';
});
</script>
<p id="reading-time"></p>

Bonus: Styling the Reading Time

Add this CSS (Appearance → Customize → Additional CSS):

.reading-time {
    font-size: 14px;
    color: #555;
    font-style: italic;
    margin: 10px 0;
}

Conclusion

• For beginners: Use a plugin (Reading Time WP)
• For developers: Manual code snippet
• For Gutenberg users: Custom HTML block

Estimated reading time improves UX and keeps readers engaged – implement it in minutes! ⏱️🚀