Results 1 to 7 of 7

Thread: Inserting Smilies

  1. #1
    SeK612's Avatar Poster BT Rep: +10BT Rep +10
    Join Date
    Nov 2002
    Location
    UK
    Posts
    718
    I'm trying to set up a guestbook so that if the user wishes they can insert smilies into posts. The GB is in PHP and doesn't contain any smilies as it is. I have the smilies and have added them to the "sign" page but can't work out the rest.

    I've looked at the html code of boards and some other guestbooks and they use a javascript command when the user clicks on the smilies

    Code:
    javascript:emoticon(':(')
    This inserts the code into the text box. The text box also recognises the inserted code and places a smilie in its place when the form is submitted.

    Is there an easy way to replicate this? Ideally I would like to keep it in PHP and HTML and not MySQL (although this may not be possible). :helpsmile:

    Thanks,

    SeK612

  2. Internet, Programming and Graphics   -   #2
    vivitron 15's Avatar Poster
    Join Date
    Jan 2003
    Location
    North East England, UK
    Posts
    1,741
    you can store the smilies as jpegs or gifs and so str_replace to change the input

    Code:
    :)
    to
    Code:
    <img src=\"images\happy.gif\" alt=\":)\" />
    using something like:

    Code:
    $row["message"] = str_replace(":angry:", "<img alt=\"angry.gif\" src=\"emoticons/angry.gif\" />", $row["message"]);
    just before the message is posted to the database: this one clearly assumes the line to be put into the guestbook is called $row
    <insert signature here>

  3. Internet, Programming and Graphics   -   #3
    SeK612's Avatar Poster BT Rep: +10BT Rep +10
    Join Date
    Nov 2002
    Location
    UK
    Posts
    718
    Thank you

    The smilies now work. I just need to fix it so when a user clicks on the image of the smilies the code is put into the text field (as it is on this forum when you click the smilies when posting).

  4. Internet, Programming and Graphics   -   #4
    vivitron 15's Avatar Poster
    Join Date
    Jan 2003
    Location
    North East England, UK
    Posts
    1,741
    well if you find an easy way, let me know - i thought it would be kinda cool, but couldnt be bothered to actually do it

    i just gave them a table of the options and let em get on with it (btw: it aint my site i had to put it on )
    <insert signature here>

  5. Internet, Programming and Graphics   -   #5
    SeK612's Avatar Poster BT Rep: +10BT Rep +10
    Join Date
    Nov 2002
    Location
    UK
    Posts
    718
    Any idea how to do it though? Is there just some code that will say put ":-)" into the text box if user clicks on image. How do these forums do it? I could do a list with all of the codes for each of the smilies but it makes it a bit harder and it&#39;d be good to have it so there were images on the list and the code was inserted when the user clicked them.

    Heres a link to the Guestbook sign page if that helps. I tried to add the javascript code which appears on this forum but it doesn&#39;t work (I guess theres some steps missing).

  6. Internet, Programming and Graphics   -   #6
    vivitron 15's Avatar Poster
    Join Date
    Jan 2003
    Location
    North East England, UK
    Posts
    1,741
    try this:

    Code:
    &#60;&#33;DOCTYPE html PUBLIC &#34;-//W3C//DTD XHTML 1.0 Transitional//EN&#34; &#34;http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&#34;&#62;
    &#60;html xmlns=&#34;http&#58;//www.w3.org/1999/xhtml&#34;&#62;
    &#60;head&#62;
    &#60;title&#62;Untitled Document&#60;/title&#62;
    &#60;meta http-equiv=&#34;Content-Type&#34; content=&#34;text/html; charset=iso-8859-1&#34; /&#62;
    &#60;script language=&#34;javascript&#34;&#62;
    	function insert_image&#40;img&#41;
    	{
    	var tagbody = document.guestform.message.value;
    	var tagbody = tagbody + img;
    	document.guestform.message.value=tagbody;
    	}
    &#60;/script&#62;
    &#60;/head&#62;
    
    &#60;body&#62;
    &#60;h2&#62;Guestbook&#60;/h2&#62;
    &#60;form name=&#34;guestform&#34; action=&#34;&#34; method=&#34;POST&#34;&#62;
    &#60;br /&#62;
    &#60;input type=&#34;text&#34; size=&#34;50&#34; name=&#34;message&#34;&#62;
    &#60;br /&#62;&nbsp;&#60;br /&#62;
    &#60;input type=&#34;button&#34; name=&#34;button1&#34; value=&#34;&#58;D&#34; onclick=&#34;insert_image&#40;&#39;&#58;D&#39;&#41;&#34;;&#62;
    &#60;input type=&#34;button&#34; name=&#34;button1&#34; value=&#34;&#58;&#40;&#34; onclick=&#34;insert_image&#40;&#39;&#58;&#40;&#39;&#41;&#34;;&#62;
    &#60;input type=&#34;button&#34; name=&#34;button1&#34; value=&#34;;&#41;&#34; onclick=&#34;insert_image&#40;&#39;;&#41;&#39;&#41;&#34;;&#62;
    &#60;/form&#62;
    &#60;/body&#62;
    &#60;/html&#62;
    It seems to work: http://www.ianrhodgson.co.uk/test/insertimage.php

    ill look at making the butttons images for you
    <insert signature here>

  7. Internet, Programming and Graphics   -   #7
    vivitron 15's Avatar Poster
    Join Date
    Jan 2003
    Location
    North East England, UK
    Posts
    1,741
    Code:
    &#60;&#33;DOCTYPE html PUBLIC &#34;-//W3C//DTD XHTML 1.0 Transitional//EN&#34; &#34;http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&#34;&#62;
    &#60;html xmlns=&#34;http&#58;//www.w3.org/1999/xhtml&#34;&#62;
    &#60;head&#62;
    &#60;title&#62;Untitled Document&#60;/title&#62;
    &#60;meta http-equiv=&#34;Content-Type&#34; content=&#34;text/html; charset=iso-8859-1&#34; /&#62;
    &#60;script language=&#34;javascript&#34; type=&#34;text/javascript&#34;&#62;
    function insert_image&#40;img&#41;
    {
    var tagbody = document.guestform.message.value;
    var tagbody = tagbody + img;
    document.guestform.message.value=tagbody;
    }
    &#60;/script&#62;
    &#60;/head&#62;
    
    &#60;body&#62;
    &#60;h2&#62;Guestbook&#60;/h2&#62;
    &#60;form name=&#34;guestform&#34; action=&#34;&#34; method=&#34;post&#34;&#62;
    	&#60;input type=&#34;text&#34; size=&#34;50&#34; name=&#34;message&#34; /&#62;
    &#60;/form&#62;
    &#60;br /&#62;&nbsp;&#60;br /&#62;
    &#60;img src=&#34;images/biggrin.gif&#34; alt=&#34;&#58;D&#34; onclick=&#34;insert_image&#40;&#39; &#58;D &#39;&#41;&#34; /&#62;
    &#60;img src=&#34;images/sad.gif&#34; alt=&#34;&#58;&#40;&#34; onclick=&#34;insert_image&#40;&#39; &#58;&#40; &#39;&#41;&#34; /&#62;
    &#60;img src=&#34;images/wink.gif&#34; alt=&#34;;&#41;&#34; onclick=&#34;insert_image&#40;&#39;&#59;&#41; &#39;&#41;&#34; /&#62;
    
    &#60;/body&#62;
    &#60;/html&#62;
    there you go - nice and simple...



    edit: missed a "/"
    <insert signature here>

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •