Add a new touch of interaction to your forum allowing users to generate their own mood images at the beginning of each forum post.
First go to
CP -> Design -> Design management (template) -> New Message Form Paste This after
Code
<tr><td class="gTableLeft">Choose Post Mood:</td><td class="gTableRight"> <img src="/postIcons/none.png" id="postIcon" class="postIcon" alt="img" /><img src="/postIcons/smile.png" class="postIcon" alt="img" /><img src="/postIcons/sad.png" class="postIcon" alt="img" /><img src="/postIcons/laugh.png" class="postIcon" alt="img" /><img src="/postIcons/shock.png" class="postIcon" alt="img" /><img src="/postIcons/straight.png" class="postIcon" alt="img" /><img src="/postIcons/tounge.png" class="postIcon" alt="img" /><img src="/postIcons/alert.png" class="postIcon" alt="img" /><img src="/postIcons/help.png" class="postIcon" alt="img" /><img src="/postIcons/settings.png" class="postIcon" alt="img" /><img src="/postIcons/coffee.png" class="postIcon" alt="img" /><img src="/postIcons/pizza.png" class="postIcon" alt="img" /><img src="/postIcons/music.png" class="postIcon" alt="img" /><img src="/postIcons/movie.png" class="postIcon" alt="img" /><img src="/postIcons/medal.png" class="postIcon" alt="img" /><img src="/postIcons/time.png" class="postIcon" alt="img" /><img src="/postIcons/chat.png" class="postIcon" alt="img" /> <style type="text/css">img.postIcon {vertical-align:middle;cursor:pointer;margin-right:5px;opacity:0.5}img.postIcon:hover,#postIcon {opacity:1.0}img.selectedposticon {vertical-align:middle}</style> <script type="text/javascript"> /* From uCause*/ var icon,mess,_icon;$('img.postIcon').click(function(){icon=this.src.match(/\w+\.png$/i);$('img[id="postIcon"]').removeAttr('id');$(this).attr('id','postIcon')});$('form[name="addform"]').submit(function(){mess=$(this).find('textarea');if(mess.val().length){mess.val('@'+(icon==undefined?'none.png':icon)+'\n'+mess.val());}});_icon = $('form[name="addform"] textarea').val().split('\n')[0].match(/\@\w+\.png$/i);if(_icon){$('form[name="addform"] textarea').val($('form[name="addform"] textarea').val().replace(/\@\w+\.png\n/g,''));icon=_icon.toString().substr(1);$('img[id="postIcon"]').removeAttr('id');$('img.postIcon[src$="'+icon+'"]').attr('id','postIcon');} </script> </td></tr></td></tr>
Now appeareance of entries Find:
Replace by:
Code
<?if(substr($MESSAGE$,0,1)='@'&&strpos($MESSAGE$,'.png')!=-1)&&len(substr($MESSAGE$,strpos($MESSAGE$,'png')))>3?><?substr($MESSAGE$,strpos($MESSAGE$,'png')+10)?><?else?>$MESSAGE$<?endif?>
Find:
Code
<td class="postTdTop"><?if($AWARDS_DO_URL$ && $USER_LOGGED_IN$ && $CUR_USER_ID$!=$UID$)?><div style="float:right"><a href="javascript://" rel="nofollow" onclick="new _uWnd('AwD','Give award',380,200,{autosize:1,maxh:300},{url:'/index/55-$UID$-28-forum-$FID$_$TID$_$ID$_16_$TIMESTAMP$'});return false;"><img alt="" src="http://s104.ucoz.net/img/icon/thumbu.png" width="13" border="0" title="Good post"></a> <a href="javascript://" rel="nofollow" onclick="new _uWnd('AwD','Give award',380,200,{autosize:1,maxh:300},{url:'/index/55-$UID$-47-forum-$FID$_$TID$_$ID$_16_$TIMESTAMP$'});return false;"><img alt="" src="http://s104.ucoz.net/img/icon/thumbd.png" width="13" border="0" title="Bad post"></a></div><?endif?>
Paste directly after the previus code:
Code
<?if(substr($MESSAGE$,0,1)='@'&&strpos($MESSAGE$,'.png')!=-1)&&len(substr($MESSAGE$,strpos($MESSAGE$,'png')))>3?><img src="/postIcons/<?substr($MESSAGE$,1,strpos($MESSAGE$,'png')+2)?>" class="selectedposticon" alt="img" /><?else?><img src="/postIcons/none.png" class="selectedposticon" alt="img" /><?endif?>
Paradox
0.0
- Rate -
Excellent
Good
Not bad
Bad
Awful 1
05/07/2025