How To Add Together Emoticons/Smileys Inwards Blogger Comments

Emoticons or smiley faces are a smashing agency to brand comments to a greater extent than interesting as well as fun, thence it's a compassion that Blogger doesn't back upward them. In this tutorial, nosotros volition larn through around elementary steps to add together these cool emoticons called Kolobok inwards Blogger/Blogspot comments, thence that y'all as well as your weblog visitors volition endure able to convey an enjoyable fourth dimension together.

UPDATE: Now available for threaded commenting arrangement too!

DEMO

Adding Kolobok Emoticons or Smileys inwards Blogger Comments

Step 1. Log inwards to your Blogger trace concern human relationship as well as larn to 'Template', as well as thence click the 'Edit HTML' button:

Step 2. Click anywhere within the code expanse as well as press the CTRL + F keys to opened upward the search box

Step 3. Search (CTRL + F) for this tag:

Step 4. Now pay attending which code y'all should use. If your comments convey no respond button, as well as thence y'all are using the previous commenting system, otherwise await for the threaded comments codes:

a) Use this script for previous commenting arrangement amongst comments that convey no respond function:

b) Script for threaded commenting arrangement amongst comments that convey the respond function:

Note: ignore the adjacent 5-8 steps if y'all convey threaded comments!

Step 5. Find this code snippet:

Step 6. Paste the next trace only higher upward it:

Step 7. Find the next tag as well as await carefully, it should endure somewhere below the code from pace 5:

Step 8. Paste the below div tag only AFTER it:

Step 9. Now detect this code:

a) For previous commenting system:

Note: if you'll detect it similar 4 times, halt at the minute ane (press Enter two times).

b) For threaded commenting arrangement detect the minute (2nd) as well as quaternary (4th) occurrence of the trace below:

Step 10. Just AFTER the trace above, add together this code:

:)

:(

:))

:((

=))

=D>

:D

:P

:-O

:-?

:-SS

:-f

d(

:-*

b-(

h-(

g-)

5-p

y-)

c-)

s-)

d-)

w-)

:-h

:X

Show Emoticons

Step 11. Finally, detect this tag:

]]>

Step 12. Add the CSS code only higher upward ]]>

.itemo{float:left;font-size:11px;height:30px;line-height:1.2;padding:10px 0;text-align:center;width:85px;}
span#smiley-toggle{clear:both;padding:15px 10px;float:left;font:bold 14px 'Oswald', sans-serif;}
span#smiley-toggle a{text-decoration:none;}
#smiley-toggle img{vertical-align:bottom;}
img.smiley{vertical-align:bottom;}

Step 13. Save the changes past times clicking the 'Save Template' as well as you're done adding emoticons inwards Blogger comments. Enjoy!