Awesome
hexo-filter-emoji
A Hexo plugin that adds emoji support, using Github Emojis API.
Check out the Emoji Cheat Sheet for all the emojis it supports.
Installation
$ npm install hexo-filter-emoji
Options
You can configure this plugin in Hexo _config.yml
. Default options:
emoji:
enable: true
className: github-emoji
styles:
customEmojis:
-
className - Image class name. For example :sparkles:
:sparkles:
the filter will generate something like this:<span class="github-emoji" style="background-image: url(https://assets-cdn.github.com/images/icons/emoji/unicode/2728.png?v8)" data-src="https://assets-cdn.github.com/images/icons/emoji/unicode/2728.png?v8">✨</span>
-
styles - inline styles. For example:
emoji: styles: font-size: 2em font-weight: bold
outputs:
<span class="github-emoji" style="font-size: 2em; font-weight: bold; background-image: url(...)" ...>
-
customEmojis - You can specify your own list. An object or JSON string is valid. The filter will first check the
customEmojis
then fallback to the [Github Emojis][ghemojis] list.For example:
emoji: customEmojis: arrow_left: https://path/to/arrow_left.png arrow_right: https://path/to/arrow_right.png
If you need to add code points that are not in the Github list, you can do this:
emoji: customEmojis: man_juggling: src: https://path/to/man_juggling.png codepoints: ["1f939", "2642"] arrow_right: https://path/to/arrow_right.png
Tag
If you do not like the ::
-style keywords, you can always use tags:
{% emoji sparkles %}
Add no-emoji: true
to front-matter to stop replacing ::
:
---
title: Hello World
no-emoji: true
---
:tada: as it is.
{% emoji tada %} still works.
Helper
You can also render a GitHub emoji from a template using the emoji
helper:
<h1>{% emoji('octocat') %}</h1>