Emoticon Module Tag

Note: The Emoticon Module is included with ExpressionEngine by default.

In order to show a pop-up window containing smilies next to your comment form you must do several things:

1. You must create a template called "smilies" (or whatever you like).

2. In the template containing your comment form, add a link similar to this:

<a href="#" onclick="window.open('{path=weblog/smileys}', '_blank', 'width=300,height=400')">Smilies</a>

Note the "path" variable.

3. In your new smiley template, add the following Javascript in your html head:

<script language="javascript">
<!--

function add_smiley(smiley)
{
opener.document.comment_form.comment.value += " " + smiley + " ";
window.close();
opener.window.document.comment_form.comment.focus();
}
//-->
</script>

Then, use the following code to create a table containing the smileys:

<table border="0" width="100%" cellpadding="6" cellspacing="1">

{exp:emoticon columns="4"}
<tr class="row">
<td class="red"><div>{smiley}</div></td>
</tr>
{/exp:emoticon}

</table>

Note the "column" parameter in the emoticon tag. It allows you to specify how many columns of smilies the table will show.

ExpressionEngine will then automatically populate the table with all of the smiley images that you have in whatever directory you have specified as your "smilies" directory in the Admin > Emoticon Preferences section of the Control Panel.