Skip to content
A Javascript module to convert Emoji keywords to images
CSS JavaScript HTML ApacheConf
Find file
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
images/emoji
tests
.bowerrc
.editorconfig
.gitattributes
.gitignore
.htaccess
.jshintrc
.travis.yml
CONTRIBUTING.md
Gruntfile.js
README.md
bower.json
emojify-emoticons.css
emojify-emoticons.min.css
emojify.css
emojify.js
emojify.js.sublime-project
emojify.min.css
emojify.min.js
index.html
package.json
update.sh

README.md

emojify.js

npm version Bower version MIT Licensed Gitter chat


Master Develop
Master branch build status Develop branch build status

Browser Results

A swiss-army-knife for all emoji, in Javascript. Used by Gitter

The emoji keywords are as described by emoji-cheat-sheet.com.

Go to this project's GitHub pages to see the code in action.

Features

  • Fast
  • Awesome
  • Made from unicorn blood
  • Available on a CDN (gasp)
  • Converts emoticons like :) :( :'(
  • Allows customisation of processed emoji
  • Includes a sample .htaccess file for caching Javascript and CSS
  • Switchable emoji sets (SOON!)

Installation

Via cdnjs [SOON]

Add this to the rest of your stylesheet imports: Then add this to your Javascript code:

Via Bower

bower install emojify.js#~1.0 --save

Via npm

npm install emojify.js#~1.0 --save

API

setConfig([object])

This works in the browser and on Node

Parameters

  • object - Optional JSON object with any of the following attributes:
Option Default Description
emojify_tag_type null When set, emojify uses this element with the class emoji emoji-#{emojiname} instead of an img with a src attribute. Example valid values: div, span
only_crawl_id null Restricts searching for emojis to a specified element & it's children. If null, and no object is passed to run(), document.body is used
img_dir 'images/emoji' Defines the path to the emoji images
ignore_emoticons false If true, only convert emoji like :smile: and ignore emoticons like :)
ignored_tags {'SCRIPT': 1,'TEXTAREA': 1,'A': 1,'PRE': 1,'CODE': 1} A list of elements that you don't want emojified

Usage

emojify.setConfig({emojify_tag_type : 'div'});

run([element])

This only works in the browser

Parameters

  • element - Optional HTML element to restrict the emojification to.

Usage

emojify.run();
// OR
emojify.run(document.getElementById('my-element'))

replace(string, [callback])

This works in the browser and on Node

Parameters

  • string - String to emojify
  • callback - Optional callback function to output emoji with

Usage

By default, emojify.js uses the internal function defaultReplacer() to replace emoji. You can override this behaviour by supplying your own callback function.

Your callback function will receive two parameters, the emoji pattern found (emoji), and the emoji name (name). In the case of emoticons, for example, emoji = ':)' and name = 'smile'.

The context in which your replacer function is run will have the config available. So you can access properties such as img_dir at this.config.img_dir.

emojify.replace('I am happy :)');
// OR
replacer = function(emoji, name) {
    // Customise output here
    return emojifiedString;
}

emojify.replace('I am happy :)', replacer);

Excluding elements from being processed

To exclude tags from being emojified, add no-emojify to their class attributes.

Contributing changes

Please read CONTRIBUTING.md.

Something went wrong with that request. Please try again.