Add Yahoo Smileys To Blogger Comments

by Simrandeep Singh on February 4, 2009

Smileys say more than just words. You might have seen smileys in comments of WordPress blogs, but this feature is not available in blogger blogs by default. Luckily here is a hack to add yahoo smileys to comments in blogger blogs.

In order to get yahoo smileys for your blog, you must have inline comments form in your blog.

How to add smileys to Blogger Comments?

Follow these simple steps given below to add yahoo smileys to your blogger blog.

Step 1: Go to Layout -> Edit HTML -> Expand Widgets

Step 2: Find the following code (Press Ctrl+F to find) :

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<h3><a expr:href='data:post.addCommentUrl'
expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a></h3>
</b:if>
</b:if>
</p>
</b:if>

Step 3: Now replace the above code with the code given below :

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<div style='-moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; width: 369; text-align: left; border: 1px solid #cccccc; padding: 5px; background: #eeeddf; height:86'>
<b>
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif' width='18'/> :) )
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif' width='18'/> ;) )
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif' width='18'/> ;;)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif' width='18'/> :D
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif' width='18'/> ;)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif' width='18'/> :p
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif' width='22'/> :( (
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif' width='18'/> :)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif' width='18'/> :(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif' width='18'/> :X
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif' width='18'/> =((
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif' width='18'/> :-o
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif' width='20'/> :-/
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif' width='18'/> :-*
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif' width='18'/> :|
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif' width='24'/> 8-}
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif' width='31'/> :) ]
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif' width='44'/> ~x(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif' width='30'/> :-t
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif' width='18'/> b-(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif' width='18'/> :-L
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif' width='34'/> x(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif' width='30'/> =))
</b>
</div>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>
</b:if>

Step 4: Now find the </body> tag and paste the following script just before it :

<script src='http://bandofgirls.googlepages.com/smiley.js' type='text/javascript'/><noscript><a href="http://anshuldudeja.blogspot.com" target="_blank">Blogger Widgets</a></noscript>

Step 5: That’s all. Now save your template and from now onwards you can use smileys in your blogger comments and enjoy.

Thanks to Anshul for this useful hack.

Also Read : How To Add Save As PDF Button To Blogger Blog

Article by

Simrandeep is the owner and editor-in-chief of TricksDaddy. He is a part-time blogger from India. Catch him on Facebook and Twitter.

Simrandeep has written 527 awesome articles.

{ 17 comments… read them below or add one }

Anonymous February 5, 2009 at 3:17 am

:-)
Testing smiley …. if you have applied it in your blog atleast… lol

Reply

Simran February 5, 2009 at 12:23 pm

I applied it to my other blog… will apply to this later

Reply

Simran February 5, 2009 at 12:45 pm

@ Anonymous

Added smileys script.. You can check it :)

Reply

Nikhil February 6, 2009 at 9:52 am

lemme test this one !! :) )

Reply

Anonymous February 8, 2009 at 2:27 pm

:) )

Reply

Anonymous February 15, 2009 at 10:56 am

:z

Reply

Anonymous February 16, 2009 at 10:27 am

:) ) ~x(

Reply

phycrewz February 19, 2009 at 6:05 am
Anonymous February 19, 2009 at 9:12 pm
Mohammad Mustafa Ahmedzai February 23, 2009 at 5:31 am

Hmm pretty interesting, I have added it to my posts now I wil try to add it to my comments area.
Keep up the good work! :)
Sincerely,
A blog of 17 O Level friends
http://qiyamah1.blogspot.com

Reply

Simran February 25, 2009 at 9:58 am

@ Mohammad Mustafa Ahmedzai

thanks and keep visiting :)

Reply

doaib July 11, 2009 at 10:44 pm

Nice hack man !
works with firefox but with IE NO :D !!
thanks for the great posts.

Reply

chiwa January 15, 2010 at 7:16 pm

I twisted the idea a bit and created a smiley comment form that work in IE6. Take a look.

http://chiwawah.blogspot.com/2010/01/add-smiley-emoticons-in-blogger.html

Reply

migo November 19, 2009 at 8:19 pm

NOT working on my blog

Reply

Claire February 4, 2010 at 11:07 am

what if i don’t have that specific code. I am using the blog template minima and can’t find it. Any ideas? please help

Reply

Nabel March 2, 2010 at 12:11 pm

Hi, i just created new smiley code for blogger comment. It do relly work!..
it has more than 1000+ smiley to be used!..
yeah!..

it simple hack.
feel free to use this 2010 smiley hack? visit here.
http://akunabel.blogspot.com/2010/03/add-1000-smiley-emoticon-in-blogger.html

Reply

gryphon14 March 10, 2010 at 6:37 am

why mine isn’t working…i followed the steps correctly but it didn’t show up a smiley icon.
could u help me please??
.-= gryphon14´s last blog ..18 to Life S01E08 (2010) =-.

Reply

Leave a Comment

Previous post:

Next post:

© 2008-2011 TricksDaddy. All Rights Reserved | Privacy Policy | Sitemap | Designed by Simrandeep Singh