jquery.emoticon.js - very tiny Javascript emoticon replacement framework  

Friday, November 13 2009

While working on a web based instant messaging application I needed to implement a relatively common feature: emoticons. Since I am such a fan of jQuery the first thing I did was google “jquery emoticons”, this yielded no viable results. I broadened the search to “javascript emoticons” and had similar results.

I couldn’t find ANY decent plugins for doing simple emoticon replacement.

*UPDATE: MUCH SUCCESS!!! I was talking some smack on Freenode ben_alman decided it was time to step it up and released an emoticon plugin based on some existing code he had grilling on the barbecue or something. *

CHECK IT OUT!! http://benalman.com/projects/javascript-emotify/

To ensure easy customization and modularity , emotes are stored in a separate JSON document ensuring that the business logic is separated from your emotes.

Leveraging jQuery, the syntax is incredible simple: $().emoticon(myString).

The returned value will replace any emotes based on your emoticon.js file with an tag with the correct image.

Example Usage:


var myString = " This is a string with a smile :-) ";
var emotedString = $().emoticon(myString);
$(body).append(emotedString);

Project Home: http://maraksquires.com/jquery.emoticon.js/

Github: http://github.com/Marak/jquery.emoticon.js

I would really like to get some contributors on this project so we can have a large selection of emoticons to easily choose from for web development!

If you are interested please send me a message on the github or push a patch! If you aren’t that techy but still want to help feel free to Contact Me and I will do my best to get back to you.


  • Posted by Marak Squires