Skip to content

Twemoji: Twitter Emoji

Utkarsh Verma edited this page Jan 11, 2019 · 7 revisions

To avoid ending up with unrendered emojis in some devices, Dream Plus offers twemoji integration, which allows the rendering of unicode emojis as SVGs.

Usage

This feature may be enabled by setting the twitterEmoji and enableEmoji config variables true.

enableEmoji = true      #Defaults to false

[params.features]
    twitterEmoji = true     #Defaults to false

For inserting emojis in your text, simply use the good 'ol MarkDown syntax for emoji and they'll be rendered as twemoji when the website is loaded. The markdown should follow Hugo emoji cheat sheet though since twemoji depends on Hugo to convert the MarkDown syntax to unicode.

It has to be noted that twemoji is just a client-side JS script which parses only the emojis within the twemoji HTML class. The script used for doing so is as follows:

(function () {
  console.log("Twemoji up and making stuff colourful!");
  for (var b = document.getElementsByClassName("twemoji"), a = 0; a < b.length; a++) {
	twemoji.parse(b[a]);    //Parse all classes named "twemoji"
  }
})();

Currently, the following fields will be twemojified:

  • About and 404 Page;
  • Cards;
  • Posts.

Custom Adjustments

You can also add more classes of your own by using an external JS file to declare and execute your twemoji function. It should be something of this sort:

(function () {
  twemoji.parse(/*Your HTML DOM containing the emoji*/);    //Parse all classes named "twemoji"
}
})();

Official repository: twitter/twemoji