Adding smiles/emote-icons to your form/message
The tutorial below demonstrates how you can implement smiles/emote-icons to your form/messages.
First create the form that will allow the user to enter the message.
(Just copy the input and the output form from example "Format the users input in a textarea like WYSIWYG").
In the code for the output, you have to add some lines of code.
First define your images path then the code that replace the characters with their smiles/emote-icons.
To make this easier the code you have to add have background color green.
Below is the code for the output form:
|
<!--- form_output.cfm > --->
<cfsetting enablecfoutputonly="Yes">
<cfset MessageComments = #Form.comments#>
<!--- Check for HTML and replace '<' and '>' --->
<cfset MessageComments = "#Replace(MessageComments, '<', '<','ALL')#">
<cfset MessageComments = "#Replace(MessageComments, '>', '>','ALL')#">
<!--- Format the users message. --->
<cfset MessageComments = "#Replace(MessageComments, chr(10), '<br>','ALL')#">
<cfset MessageComments = "#Replace(MessageComments, chr(9), ' ', 'ALL')#">
<cfset MessageComments = "#Replace(MessageComments, ' ' , ' ', 'ALL')#">
<!--- Define path to smiles/emote-icons and name them. --->
<cfset regular_smile = "<img src=http://www.your_site/images/smilys/regular_smile.gif border=0 alt=Regular-Smile>">
<cfset wink_smile = "<img src=http://www.your_site/images/smilys/wink_smile.gif border=0 alt=Wink-Smile>">
<cfset envelope = "<img src=http://www.your_site/images/smilys/envelope.gif border=0 alt=Envelope>">
<!--- Find smile characters and replace them with the emote-icons. --->
<cfset MessageComments = "#Replace(MessageComments, ':-)',regular_smile,'ALL')#">
<cfset MessageComments = "#Replace(MessageComments, ';-)',wink_smile,'ALL')#">
<cfset MessageComments = "#Replace(MessageComments, '(E)',envelope,'ALL')#">
<!--- Output the massage using 'ParagraphFormat'. --->
<cfoutput>#ParagraphFormat(MessageComments)#</cfoutput>
<cfsetting enablecfoutputonly="no"> |
This is the text that we type in the input form:
Here's the output with a regular smile :-) a wink smile ;-) and an envelope (E).
Have fun ;-)
And here's our output:
Here's the output with a regular smile 
a wink smile 
and an envelope 
.
Have fun
Advertisement
No User Comments.
No User Comments, be the first one to write your comments?
