Miss any of our Open RFC calls?Watch the recordings here! »

@11tyrocks/eleventy-plugin-emoji-readtime

1.0.1 • Public • Published

Eleventy Plugin: Emoji Read Time

Display an estimated read time for Eleventy content, optionally with an emoji visual indicator.

To Use

This plugin provides a filter that can be applied by passing in the Eleventy-supplied content variable, which work best from the layout used by the content. A simple string is returned, so the text formatting is up to you.

First, install the plugin in your project:

npm install @11tyrocks/eleventy-plugin-emoji-readtime

Then, include it in your .eleventy.js config file:

const emojiReadTime = require("@11tyrocks/eleventy-plugin-emoji-readtime");
 
module.exports = (eleventyConfig) => {
  eleventyConfig.addPlugin(emojiReadTime);
};

*Review config options and examples below for how to modify the output

Finally, add it as a filter to content wherever you'd like it to display:

<p>{{ content | emojiReadTime }}</p>

Example output with defaults:

🍿 7 min. read

Config Options

Option Type Default
wpm number 275
showEmoji boolean true
emoji string 🍿
label string min. read
bucketSize number 5

Config Examples

Change the emoji in use, the words-per-minute (wpm), the label, and the bucketSize, where bucketSize is what minute is divided by to determine how many emoji to show:

eleventyConfig.addPlugin(emojiReadTime, {
  emoji: "📕",
  label: "mins",
  wpm: 300,
  bucketSize: 3,
});

Which would output:

📕📕 7 mins

Remove emoji from being displayed

Or, remove the emoji and only display the number of minutes and a label:

eleventyConfig.addPlugin(emojiReadTime, { showEmoji: false });

Credits

Install

npm i @11tyrocks/eleventy-plugin-emoji-readtime

DownloadsWeekly Downloads

22

Version

1.0.1

License

ISC

Unpacked Size

3.8 kB

Total Files

3

Last publish

Collaborators

  • avatar