Gossamer Forum
Home : Products : Gossamer Forum : Discussion :

Re: [Westin] How does the /include_smilies_write.html template work?

Quote Reply
Re: [Westin] How does the /include_smilies_write.html template work? In reply to
So the full process (to make it easier for anybody else that wants to replace and or add more similes or other images to the quick smilies chart on the left side of the editors).

Stereo Instructions ;)

1. Upload any new smilie images you want to use to your forums /images/ folder

2. In GForums Administration panel, click on Markup, then Add a new Tag (not a Text Tag)

3. Add any new smilie tags that you want to make available to your users. (see Notes at the bottom for suggestions)

4. Click Templates in Admin panel and edit the user template /include_smilies_write.html Adding new table rows to the bottom of the rows of tables (use the existing table row code in that file) or
add the example code below to the /include_smilies_write.html template

Add this code (replacing any instance of smiliename with the word you want the user to type to produce the smilie, and replacing any instance of smilieimagename.gif with the real image name of the image you uploaded in step 1 above)
Code:

<tr>
<td><a href="javascript: <%if html_editor%>top.editor_iframe.<%endif%>addTag('smiliename')" tabindex=25><img src="<%image_url%>/smilieimagename.gif" border=0></a></td>
<td><a href="javascript: <%if html_editor%>top.editor_iframe.<%endif%>addTag('smiliename')" tabindex=25><img src="<%image_url%>/smilieimagename.gif" border=0></a></td>
<td><a href="javascript: <%if html_editor%>top.editor_iframe.<%endif%>addTag('smiliename')" tabindex=25><img src="<%image_url%>/smilieimagename.gif" border=0></a></td>
</tr>


Before this code:
Code:

</tr>
</table>



4A. Edit any existing smilie code in the
/include_smilies_write.html template to replace any existing smilies that you want to replace with new smilie code and smilefilename.gif images
For example, one line of existing code is:
Code:

<td><a href="javascript: <%if html_editor%>top.editor_iframe.<%endif%>addTag(';)')" tabindex=25><img src="<%image_url%>/wink.gif" border=0></a></td>

You could change it to :
Code:

<td><a href="javascript: <%if html_editor%>top.editor_iframe.<%endif%>addTag('wink')" tabindex=25><img src="<%image_url%>/wink.gif" border=0></a></td>

This assumes you want the user to type in [wink] to produce Wink and that the image you want to associate with the [wink] tag is actually named wink.gif and has been uploaded in step 1 above.





If you want to add new smlies to the existing selection of smilies that appear on the pages you see when you post a new message or edit an existing message then continue on, else you are done.




5. Ftp to your server and make a backup of the original editor.js file (either on the server or locally) THIS STEP IS CRUCIAL - If you mess up the editor.js file with even one out of place comma, the post display box will not show up until you find and fix the mistake.

6. Download the editor.js file (you'll be working on this file)

7. In the editor.js file look for:
Code:

var Faces = {
':)' : '<%escape_js image_url%>' + '/smile.gif',
';)' : '<%escape_js image_url%>' + '/wink.gif',
':(' : '<%escape_js image_url%>' + '/frown.gif',
':P' : '<%escape_js image_url%>' + '/tongue.gif',
'cool' : '<%escape_js image_url%>' + '/cool.gif',
'blush' : '<%escape_js image_url%>' + '/blush.gif',
'angelic' : '<%escape_js image_url%>' + '/angelic.gif',
'crazy' : '<%escape_js image_url%>' + '/crazy.gif',
'mad' : '<%escape_js image_url%>' + '/mad.gif',
'shocked' : '<%escape_js image_url%>' + '/shocked.gif',
'laugh' : '<%escape_js image_url%>' + '/laugh.gif',
':/' : '<%escape_js image_url%>' + '/unsure.gif',
':|' : '<%escape_js image_url%>' + '/unimpressed.gif',
'sly' : '<%escape_js image_url%>' + '/sly.gif',
'pirate' : '<%escape_js image_url%>' + '/pirate.gif'
};


Insert Before

Code:

'pirate' : '<%escape_js image_url%>' + '/pirate.gif'


This coding:
Code:

'pirate' : '<%escape_js image_url%>' + '/pirate.gif',

replacing smiliename and smilieimagename.gif with the word you want people to type to produce the smilie, and the actual smilie image name you uploaded in step 1.

Add as many of the above extra lines of code as you have added new smilies that you want to appear on the post and edit pages next to the main message body entry form.

8. Save and upload (in ASCII mode NOT binary)

That's pretty much it. Now when you go to post a new message or edit an existing message you should see the changed smilies, or the newly added smilies to the table on the left side of the main message body entry box.


Notes: I name all my smilies with the actual word to describe them instead of using the more cryptic (and traditional) BB smilie code. For example, because the version of GForums that we have access to requires me to type [;)] to produce the ;) smilie, it's far easier for your memebers to remember, and type in [wink] than it is to type in [;)] (it's all that extra shift key work, and the added [ ] brackets that earlier versions of Gforums requires)

So I either rename all existing smilies, or add any new smilies with real world words:
examples
Code:

[wink]
[smile]
[cry]
[frustrated]
[thumbsup]
[bonkhead]
[tongue]
etc


Those are just some examples of some smilies that we use regularly, our members on all of our older forum sites don't even click the icons to insert them anymore, they simply type in the smilie code (inside of the [ ] brackets of course) as they are typing in the message. Im sure if you do the same they will appreciate it in Gforums. With the newest version of Gforums (the one that only GT has access to right now) you'll be able to type in [;)] without the brackets and produce ; ) when such a time as the users have access to this new forum code, you can simply add in more tags for the most common smilie cryptic commands like [:)] (without the brackets being necessary.

Last edited by:

Westin: May 24, 2009, 10:25 AM
Subject Author Views Date
Thread How does the /include_smilies_write.html template work? Westin 5909 May 20, 2009, 1:06 PM
Thread Re: [Westin] How does the /include_smilies_write.html template work?
Andy 5827 May 21, 2009, 12:49 AM
Thread Re: [Andy] How does the /include_smilies_write.html template work?
Westin 5840 May 21, 2009, 1:01 AM
Thread Re: [Westin] How does the /include_smilies_write.html template work?
Andy 5817 May 21, 2009, 1:15 AM
Thread Re: [Andy] How does the /include_smilies_write.html template work?
Westin 5840 May 21, 2009, 1:33 AM
Thread Re: [Westin] How does the /include_smilies_write.html template work?
Andy 5838 May 21, 2009, 1:35 AM
Thread Re: [Andy] How does the /include_smilies_write.html template work?
Westin 5749 May 23, 2009, 11:21 PM
Thread Re: [Westin] How does the /include_smilies_write.html template work?
Westin 5729 May 24, 2009, 7:44 AM
Post Re: [Westin] How does the /include_smilies_write.html template work?
Westin 5709 May 24, 2009, 10:17 AM