Smilies are already included in WordPress, and can be activated by checking the box next to "Convert emoticons like :-) and :-P to graphics on display" in Options > Writing.

Matt Read has an excellent smilies plugin you might want to check out

Image Location

In version 2.0 these are in the /wp-includes/images/smilies directory.

In version 1.5.2 they are in /wp-images/smilies directory.

If you have checked the box above but empty icons appear on your page, it could be that the images have been uploaded in ASCII format by your ftp program. This breaks them.

Delete the smilies directory and re-upload the /smilies folder ensuring that they are transferred in BINARY format.

How do I know what makes each smiley appear ?

The directory /wp-includes has a file called 'vars.php' - this holds the information you need.

Between lines 109 and 153 is the text that corresponds to each smiley.
Each smiley can usually be caused to appear by using different text characters - there is no 'International Standard' for smilies yet !


' :)' => 'icon_smile.gif',
' :D' => 'icon_biggrin.gif',
' :-D' => 'icon_biggrin.gif',
':grin:' => 'icon_biggrin.gif',
' :)' => 'icon_smile.gif',
' :-)' => 'icon_smile.gif',
':smile:' => 'icon_smile.gif',

Note the space that some of the text has after the ' but before the smiley text. That is to prevent smilies being accidentally included in proper text.

Can I use different smilies ?


First go find your new smilies. Upload them - in BINARY format - to the /smilies directory.
Note the names of each smiley.

What you are going to now is create smilies that will override the ones already in WordPress.

Download your wp-config.php

Open it in a plain text editor.
Scroll to the bottom, and look for this:

define('ABSPATH', dirname(__FILE__).'/');

Now, copy what I have next so your file looks the same:
define('ABSPATH', dirname(__FILE__).'/');
$wpsmiliestrans = array(
' :)' => 'smile.gif',

Copy it carefully - every character matters !
So what you have there is the first smiley you might use. To add your custom smilies, copy the exact structure of the line again and again. For instance:
$wpsmiliestrans = array(
' :)' => 'smile.gif',
' ;-)' => 'wink.gif',
':idea:' => 'lightbulb.gif',
':blush:' => 'blush.gif',
':bored:' => 'bored.gif',
':secret:' => 'secret.gif',
':yawn:' => 'yawn.gif',
':yummy:' => 'yummy.gif',
':neutral:' => 'blank.gif',
':love:' => 'heart.gif'
Note that the only time you leave off the comma is on the last line.

This completely overrides the default WP smilies - so if you don't define :) here, then all you will see on your blog is :)

How do I make smilies appear for my comments ?

For that, you will need to download the plugin 'wp-grins'. This is available from the site of Alex King. It is very easily integrated into your site so smilies will appear both in your comments section and in your editing panel.

So how do I use wp_grins ?

Install and activate the plugin. You now have two small edits to make. The first is in the comments file, the second in an admin file.

Add to Comments

Your commenters can click on smilies to use.
Open the file comments.php (or comments-popup.php if you use those) in notepad.
Look for the line that has this on it;

<textarea name="comment" id="comment"
Now right above that line, add the call to the plugin so it looks like this:
<?php wp_grins(); ?>
<textarea name="comment" id="comment"

Add to the admin screen

For 1.5.2

Open the file wp-admin/admin-functions.php in Notepad
find line 588. That line is

echo '</div>';

Add the following line so that it looks like this:
if (function_exists("wp_grins")) { echo ""; wp_grins(); }
echo '</div>';
Save the file, upload and all will be good.

For 2.0

You need to make two changes. First to the plugin:

Open the plugin file, and find this line (it's 34)

$grins .= '<img src="'.get_settings('siteurl').'/wp-images/smilies/'.$grin.'" alt="'.$tag.'"
You need to replace part of that line:
$grins .= '<img src="'.get_settings('siteurl').'/wp-includes/images/smilies/'.$grin.'" alt="'.$tag.'"

See the /path/change/ ? Do the same. Save the plugin and upload it.

Open the file wp-admin/admin-functions.php in Notepad
and find lines 1085 - 1087 below function the_quicktags(). They look like this:

else echo '
Copy the part in bold below to the same place
if (function_exists("wp_grins")) { echo "
"; wp_grins(); }

else echo '
Save the file, upload. You should then have clickable smilies in admin. Note: You cannot have clickable smilies AND the WYSIWYG editor. If both are present you will be able to see the smilies but nothing will happen when you click them. You will need to switch the new editor off for them to work.

Credits to Vicky at for nudging me as I'd forgotten to add the 2.0 directions and to Les at for continually posting useful stuff to the Support Forums

I see errors !

Which ones ?

If the error says 'headers already sent, it's a whitespace issue

If the error says something about an 'unexpected' something, you made a mistake when you changed 'vars.php'.

Be sure to follow the exact format - if you get errors after changing your smilies, download the file and carefully inspect those lines you have changed. Check every comma and semi-colon - they all matter :)


These pages are independent of
All design, content & images © Mark 2004-2015. All rights reserved.