← All examples

JavaScript Reading & focus bbc.com

BBC: estimated reading-time badge

Counts the words in an article and shows an estimated reading time below the headline.

Code to copy

// Show an estimated reading-time badge below the headline
(function () {
  if (document.getElementById('jz-bbc-readtime')) { return; }
  var blocks = document.querySelectorAll('[data-component="text-block"]');
  if (!blocks.length) { return; }
  var words = 0;
  blocks.forEach(function (b) {
    words += (b.textContent || '').trim().split(/\s+/).length;
  });
  var mins = Math.max(1, Math.round(words / 220));
  var h1 = document.querySelector('article h1') || document.querySelector('h1');
  if (!h1) { return; }
  var badge = document.createElement('div');
  badge.id = 'jz-bbc-readtime';
  badge.textContent = mins + ' min read';
  badge.style.cssText = 'display:inline-block;margin:6px 0;padding:2px 8px;' +
    'background:#b80000;color:#fff;font-size:13px;border-radius:3px';
  h1.insertAdjacentElement('afterend', badge);
})();

How to use this example

  1. Copy the code with the button above.
  2. Install JustZix (2 minutes) and open the extension on the target page.
  3. Add a new rule matching that page.
  4. Paste the code into the rule's JavaScript panel and save — it runs on every page visit.

Rate this example

No ratings yet — be the first.

Does this example work?

Snippets are useless without somewhere to paste them.

JustZix takes 2 minutes to install and runs your code on every matching page. No account, no payment.

Download free See use cases