Tutorial : Add and Display More Smile on WordPress

By default WordPress only have few smile and not display on toolbar when you post or create comment. You must write combine character to create smile like : ) and WordPress will convert it to smile. To display smile and available for click when post comment or create post you need WP Grins plugin. If you want to add more smile from Yahoo or MSN you need to hack WordPress file and this is that will discuss in this tutorial.

Add More Smile to WordPress :

In this example i will show you how to added some Yahoo smiles on your WordPress.

1. Download Yahoo Smile.

1. Extract smiles file to wp-includes/images/smiles

2. Open functions.php in wp-includes folder.

3. Find this code :

if ( !isset( $wpsmiliestrans ) ) {
$wpsmiliestrans = array(
':mrgreen:' => 'icon_mrgreen.gif',
':neutral:' => 'icon_neutral.gif',
':twisted:' => 'icon_twisted.gif',
':arrow:' => 'icon_arrow.gif',

4. Add this code below it

':angel:' => 'yahoo_angel.gif',
':angry:' => 'yahoo_angry.gif',
':beatup:' => 'yahoo_beatup.gif',
':bigsmile:' => 'yahoo_bigsmile.gif',
':brokenheart:' => 'yahoo_brokenheart.gif',
':bye:' => 'yahoo_bye.gif',
':callme:' => 'yahoo_callme.gif',
':nangis:' => 'yahoo_cry.gif',
':angel:' => 'yahoo_dance.gif',
':mimpi:' => 'yahoo_daydream.gif',
':doh:' => 'yahoo_doh.gif',
':gaktau:' => 'yahoo_dontknow.gif',
':laughloud:' => 'yahoo_laughloud.gif',
':cinta:' => 'yahoo_love.gif',
':mean:' => 'yahoo_mean.gif',
':uang:' => 'yahoo_moneyeyes.gif',
':budek:' => 'yahoo_notlistening.gif',
':berdoa:' => 'yahoo_pray.gif',
':ketawa:' => 'yahoo_rotfl.gif',
':malu:' => 'yahoo_shame.gif',
':ssst:' => 'yahoo_shhhh.gif',
':silent:' => 'yahoo_silent.gif',
':sunglass:' => 'yahoo_sunglas.gif',
':talktohand:' => 'yahoo_talktohand.gif',
':berpikir:' => 'yahoo_think.gif',
':capek:' => 'yahoo_tired.gif',
':wek:' => 'yahoo_tongue.gif',
':waiting:' => 'yahoo_waiting.gif',
':wink:' => 'yahoo_wink.gif',
':kesel:' => 'yahoo_witsend.gif',
':cemas:' => 'yahoo_worried.gif',
':ampun:' => 'yahoo_worship.gif',
':youkiddingme:' => 'yahoo_youkiddingme.gif',

:angel : is shortcut to display the smile and yahoo_angel.gif is file name.

5. You can add your own smile using this method.

Display your smiles on Comment Form and Post Form

1. Install and Activate WP Grins plugin

2. Now you should see smile on your comment and post form.

3. Smiles will be automatic added to comment form when you click it, but not in post form. You need doing this trick.

Drag and drop smile to writing post form.

– View HTML code

– You should see this code :

<img onclick="grin(':bigsmile:');" src="<strong>../wp-includes/images/smilies/yahoo_bigsmile.gif</strong>" alt=":bigsmile:" />

– Now remove .. and / on src, like this :

<img onclick="grin(':bigsmile:');" src="<strong>wp-includes/images/smilies/yahoo_bigsmile.gif</strong>" alt=":bigsmile:" />

Other way to add smile to post form is write shortcut that you has define in post form.

Post comment to try this tips.

13 thoughts on “Tutorial : Add and Display More Smile on WordPress”

Leave a Comment