Your Login Details


Jquery Plurk Emoticons Plugin

I've been wanting to create this plugin for almost a year. Since I don't have the ability to create modx plugin (as my blog using modx for it's cms engine), I proceed to the next best thing that is by replacing the emoticons symbol inside html with the correct image using javascript. Using simple jquery syntax and the power of regex and a little bit of help from this wordpress plugin, I'm able to finish this plugin in just 3 days using my spare time at the office before maghrib came.

The idea behind this plugin is simple, in the html text of selected jquery selector, if the plugin found emoticons symbol in it, the plugin will replace it with the correct image tag. And here's the catch, Because I fancy Plurk emoticons, so.... this plugin is using emoticons symbol from plurk *PLUS* emoticon symbol that I create myself, such us: (mario), (luigi), (yoshi), etc. 

Here's how you use it in your code:

  • include the required .js files in the head of your html file, like so:

    <script src="/assets/js/jquery.js"></script>
    <script src="/assets/js/emoticons/emoticons.js"></script>
    
  • Then create something like this in your html file:

    <script type="text/javascript">
    $(function() {
       $("#commentsAnchor").emoticons ({
         url:"http://dwaan.com/assets/js/emoticons/emo/"
       });
    });
    </script>

Replace the url, with the url where you store the emoticon files collection and the jquery selector with your own jquery selector, and wallah. If you still don't understand how to use it just view source this page, I'm using this plugin for the comment section.

Download the file here:

emoticons.7z

Ps: You have to install 7Zip first to unpack the file.

Link: The Inspiration | Jquery Website | 7-Zip website | The Wordpress plugin


The Comments

Write a comment

  • Required fields are marked with *. (do'oh)

Type your name here, but it not necessary, because I had anticipate your lazy hand.

Yes, you can leave it empty. It's not like that I'm going to write you an email. But if you do, I will display your Gravatar.

It's unnecessary to provide your blog url, but here it is. Use this format: http://www.dwaan.com.

You're encourage to write a subject. Well if not, I'll give some nasty and ugly subject to your comment.

You really have to write your comment below, it's required. I mean, you want to write a comment wont you?.

If you have trouble reading the code, click on the code itself to generate a new random code.

Sorry, I don't trust you are human. Please type those funky words to prove you are a human.

 

 

Comment
test yah gan
Thu March 04, 2010, 11:37:11
dah bisa jalan disinih gan? ane mau test yah..

(okok) (okok) (taser) (yahoo)

DwAN
Comment
Re: Jquery Plurk Emoticons Plugin
Thu March 04, 2010, 11:40:53
udah dong gan, kan udah melalui pengetesan secara intensive (banana_rock) (okok)
Comment
munculin
Thu March 04, 2010, 12:08:37
gmn biar munculin nya gan? jd toolbar emoticon gtu, ky di page comment di blog ane.
jng tanggung2 gan sharingnya.. (unsure)


(banana_cool)
Last Edit: March 04, 2010, 12:11:05 by dwan  

DwAN
Comment
Re: Jquery Plurk Emoticons Plugin
Thu March 04, 2010, 12:12:44
@Bung Jay: Sengaja gan, sebenarnya ini dibuat untuk easter egg di website gede yang desainnya dibikin gw, jadi gak perlu pake toolbarnya :D. Btw, komen loo gw edit adanya banana_cool bukan banana_dance (banana_cool)

Some Stranger
Comment
Re: Jquery Plurk Emoticons Plugin
Sun March 21, 2010, 18:03:53
XD

Some Stranger
Comment
Re: Jquery Plurk Emoticons Plugin
Sun March 21, 2010, 18:04:33
:)

Some Stranger
Comment
Re: Jquery Plurk Emoticons Plugin
Sun March 21, 2010, 18:04:57
(mario)

Some Stranger
Comment
Re: Jquery Plurk Emoticons Plugin
Sun March 21, 2010, 18:05:21
(yupi)

Some Stranger
Comment
Re: Jquery Plurk Emoticons Plugin
Sun March 21, 2010, 18:05:42
(luigi)

DwAN
Comment
Re: Jquery Plurk Emoticons Plugin
Mon March 22, 2010, 10:26:26
(yahoo) pagi2 udah dibanjiri spam dan comment ini artikel (headspin)

Some Stranger
Comment
Re: Jquery Plurk Emoticons Plugin
Sat April 10, 2010, 20:32:30
(Banana_cool)

DwAN
Comment
Re: Jquery Plurk Emoticons Plugin
Wed April 14, 2010, 07:45:10
just to let you know, (pertamax)
I <3 (dsi) (wii)
Last Edit: April 14, 2010, 07:46:19 by dwan  
Comment
Re: Jquery Plurk Emoticons Plugin
Sat September 11, 2010, 15:41:27
heheheehe eyeroll fish_hit
Comment
Re: Jquery Plurk Emoticons Plugin
Sat October 09, 2010, 09:37:02
dwan, bikinin untuk wordpress plugin doooong (ninja) *males.com*

DwAN
Comment
Re: Jquery Plurk Emoticons Plugin
Sat October 09, 2010, 12:39:24
@mela: Pan ada tuh link ke wordpress pluginsnnya