• RSS
  • Delicious
  • Digg
  • Facebook
  • Twitter
  • Linkedin
  • Increase Website And Blog Traffic:latest article for Increasing Blog and website Traffic free gide.....
  • Create and Upload Site Map to Google:Google is fist largest Search Engine by upploading SITE MAP Google Easily Search Links from Ur site in Searching.......
  • Fix WEB SITE Errors:Google and other search engines always take those site in there fist page in searching which ha too less web Errors...
  • Top 20 Search Engine:Submit Ur site to top 20 Search Engines to Increasing Ur Site Traffic and making money top search engines like as Google, Yahoo, Ask, AOl, MSN...
  • Top Social Sites:Top 100 Social sites which real help U make a Affliate Marketer and in Pormoting ur Producdts...

New Posts

How to Add Emoticons/Smileys in Blogger Comments

Posted by Mohsin On 4/18/2012 12:54:00 PM 19 comments

Emoticons/Smileys are a great way of making discussions more interesting and fun, so it's a pity that Blogger don't support them. This tutorial will show you some simple steps on how to add some very cute emoticons called Kolobok to your Blogger/Blogspot comments, so that you and your blog visitors will be able to have an enjoyable time together.

Now available for threaded commenting system too!

emoticons in blogger, kolobok smileys, threaded comments



How To Add Kolobok Smileys In Blogger Comments

Step 1. Go to Dashboard - Template - Edit HTML - Proceed


 Step 2. Expand Widget Template (make a backup)


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

    </body>

    Step 4. Copy and paste just above it, this code:

    • For previous commenting system (comments without reply option)
    <!--kolobok-smileys-->
    <script src='http://helplogger.googlecode.com/svn/trunk/[helplogger.blogspot.com]smileys.js' type='text/javascript'/><noscript><a href='http://helplogger.blogspot.com/2012/04/how-to-add-emoticonssmileys-in-blogger.html' target='_blank'><span style='font-size: x-small;'>Add emoticons</span></a></noscript>
    <!--kolobok-smileys-->

    • For threaded commenting system (comments with reply option)
    <script src='https://helplogger.googlecode.com/svn/trunk/kolobok threaded.js' type='text/javascript'/>

    Note: ignore steps 5-8 if you are using threaded comments!

    Step 5. Now find this code snippet:

    <b:loop values='data:post.comments' var='comment'>

    Step 6. Paste the following code just above it:

    <div id='smileys'>

    Step 7. Find the following code (look carefully, it should be somewhere below the code from step 5)

    </b:loop>

    Step 8. Paste the following tag just after it:

    </div>

    Step 9. Now find this code:

    • For previous commenting system:
    <data:blogTeamBlogMessage/>

    Note: if you'll find it like 4 times, stop to the 2nd one!

    • For threaded commenting system:
    <div class='post-footer-line post-footer-line-3'>

    Step 10. And add this code just after it:

    <b:if cond='data:blog.pageType == &quot;item&quot;'><script type='text/javascript'>
    //<![CDATA[
    function moreSmilies() {
        document.getElementById('smiley-more').style.display = 'inline';
        document.getElementById('smiley-toggle').innerHTML = '<a href="javascript:lessSmilies()"><div style="font-size:small; font-weight:bold;color:#000000;">Hide Emoticons /<a href="http://helplogger.blogspot.com/2012/04/how-to-add-emoticonssmileys-in-blogger.html">Add Emoticons</div></a></span>';
    }
    function lessSmilies() {
        document.getElementById('smiley-more').style.display = 'none';
        document.getElementById('smiley-toggle').innerHTML = '<a href="javascript:moreSmilies()"><div style="font-size:small; font-weight:bold;">Show Emoticons</div></a>';
    }
    //]]>
    </script>
    <div class='emoticons'>
    <span id='smiley-more' style='display: none;'>
    <img src='http://4.bp.blogspot.com/-k4ujC23cSgI/UTIq7eUkmuI/AAAAAAAABAQ/YUNL9_RhDB0/s1600/smile3.gif'/>:)
    <img src='http://2.bp.blogspot.com/-XSBJ7zBZKZs/UTIrT-hMYyI/AAAAAAAABAY/6B26_8Ttwj4/s1600/sad.gif'/>:(
    <img src='http://2.bp.blogspot.com/-Ph2wxEvy2mc/UTIr8-fdHjI/AAAAAAAABAo/3use2PsPhMA/s1600/taunt.gif'/>:))
    <img src='http://3.bp.blogspot.com/-pcE-4ot-gjk/UTIsLRff6SI/AAAAAAAABAw/LYvZ8__88Ak/s1600/cry2.gif'/>:((
    <img src='http://1.bp.blogspot.com/-lNNTReQVc0A/UTIrjDhVLAI/AAAAAAAABAg/BsVMYnr54pI/s1600/rofl.gif'/>=))
    <img src='http://1.bp.blogspot.com/-8C5UH12mxf0/UTIzmsxczDI/AAAAAAAABDA/2seHdqLVQ6Q/s1600/suicide.gif'/>=D&gt;
    <img src='http://4.bp.blogspot.com/-lhTywmMZ58E/UTI04kjJ3WI/AAAAAAAABDY/qNgtijEr_E8/s1600/biggrin.gif'/>:D
    <img src='http://1.bp.blogspot.com/-gG_Wn6D6Ux4/UTIyqFyfKbI/AAAAAAAABCo/qEmU8s8ndVI/s1600/tongue.gif'/>:P
    <img src='http://3.bp.blogspot.com/-Zb5g0OWHx4c/UTIsuPLt90I/AAAAAAAABA4/cmP1ltBmVF0/s1600/shock.gif'/>:-O
    <img src='http://1.bp.blogspot.com/-TSIzPWeGBwk/UTI0S-nw5tI/AAAAAAAABDQ/xyHPCFZH4fI/s1600/think.gif'/>:-?
    <img src='http://1.bp.blogspot.com/-qpnD1BYon5w/UTI0AIeKX6I/AAAAAAAABDI/HsllV7NYTqk/s1600/unsure.gif'/>:-SS
    <img src='http://4.bp.blogspot.com/-SpvC8mHHwhg/UTIzQMUVGKI/AAAAAAAABCw/_NKKVyQtulk/s1600/flowers1.gif'/>:-f
    <img src='http://3.bp.blogspot.com/-qlyn_deOhFw/UTIzY8aRgqI/AAAAAAAABC4/pfSojMdD33s/s1600/doh.gif'/>d(
    <img src='http://2.bp.blogspot.com/-H4e_O5BFVP8/UTIumwhVmKI/AAAAAAAABBw/SKhY4DDxKkk/s1600/air_kiss.gif'/>:-*
    <img src='http://3.bp.blogspot.com/-h4yNmhdKUVU/UTIwUKpvVOI/AAAAAAAABCY/B0FEZVRGHe4/s1600/threaten.gif'/>b-(
    <img src='http://4.bp.blogspot.com/-veVoDPEc7I4/UTIv9wCS0jI/AAAAAAAABCQ/4c5FgCHAiU4/s1600/help.gif'/>h-(
    <img src='http://2.bp.blogspot.com/-_ttAcnBbAaw/UTIvKtxfWvI/AAAAAAAABCA/X2JLEShhOQU/s1600/good.gif'/>g-)
    <img src='http://2.bp.blogspot.com/--o9jZ1nMcec/UTIuyCBgS_I/AAAAAAAABB4/Jf03oz5yKrU/s1600/beee.gif'/>5-p
    <img src='http://2.bp.blogspot.com/-6-BTJcVpwY0/UTIvhF_PL-I/AAAAAAAABCI/SS-LDADTSls/s1600/yahoo.gif'/>y-)
    <img src='http://3.bp.blogspot.com/-khAwhIYbgvQ/UTItD_PfNyI/AAAAAAAABBI/HMpRMQh5Uak/s1600/crazy.gif'/>c-)
    <img src='http://2.bp.blogspot.com/-fsTXhXl10Gg/UTIs7Ll01AI/AAAAAAAABBA/QkWgWAAFG3g/s1600/spiteful.gif'/>s-)
    <img src='http://2.bp.blogspot.com/-CIuUuJeuyGI/UTIueHgTxOI/AAAAAAAABBo/BzXkTEEDlhw/s1600/drinks.gif'/>d-)
    <img src='http://2.bp.blogspot.com/-Mc5ed3Ymk7s/UTI1GIXMAMI/AAAAAAAABDg/PyDOfoXgsl0/s1600/cheer.gif'/>w-)
    <img src='http://2.bp.blogspot.com/-JOgaMRI61Jk/UTItsGc5KdI/AAAAAAAABBY/6UDCabfZQbg/s1600/hi+2.gif'/>:-h
    <img src='http://2.bp.blogspot.com/-wmOB_Z6LPp4/UTIt9FhZiwI/AAAAAAAABBg/7VoefgIQjEs/s1600/give_heart.gif'/>:X
    </span>
    <span id='smiley-toggle'><a href='javascript:moreSmilies()'><div style='font-size:small;font-weight:bold;'>Show Emoticons <img src='http://4.bp.blogspot.com/-k4ujC23cSgI/UTIq7eUkmuI/AAAAAAAABAQ/YUNL9_RhDB0/s1600/smile3.gif'/></div></a></span>
    </div></b:if>

    Note: Ignore steps 11-12 if you are using threaded comments!

    Step 11. Finally, find this code

    ]]></b:skin>

    Step 12. Add this one below, just above ]]></b:skin>

    .emoticons {-moz-background-clip: -moz-initial;-moz-background-origin: -moz-initial;-moz-background-inline-policy: -moz-initial;text-align: left;width:400px;}
    .emoticons a, .emoticons a:hover {margin-left: 20px;text-decoration:none;}

    Note: if you want to change the size of the emoticon container, edit the red code.

    Step 13. Save the Template and you're done. Enjoy!

    If you have any problem and need help, please leave a comment below.

    19 comments:

    I'm curious to find out what blog system
    you're working with? I'm experiencing some minor
    security issues with my latest website and I'd like to find
    something more safeguarded. Do you have any suggestions?


    Here is my web blog :: youfit fitness

    Howdy are using Wordpress for your site platform? I'm new
    to the blog world but I'm trying to get started and create my own. Do you require any coding knowledge to
    make your own blog? Any help would be greatly appreciated!


    my page: 8 ball pool download

    I was recommended this blog via my cousin. I am not positive whether this put up is written by means of him as no one else recognise such special about my trouble.
    You're wonderful! Thanks!

    Look into my blog post ... online play pool games

    Your style is so unique in comparison to other people I've read stuff
    from. Many thanks for posting when you've got the opportunity,
    Guess I'll just bookmark this blog.

    my web page 8 ball online

    This article offers clear idea in favor of the new users of blogging, that in fact how to do blogging.


    my blog ... free download games pool

    Great beat ! I would like to apprentice at the same time as you amend your website, how can i subscribe
    for a weblog website? The account aided me a applicable deal.
    I have been tiny bit acquainted of this your broadcast offered shiny transparent concept

    my page ... play pool games 8 ball

    I will immediately clutch your rss feed as I can't to find your e-mail subscription hyperlink or newsletter service.
    Do you've any? Kindly permit me recognise in order that I may subscribe.
    Thanks.

    my homepage ... billiards free online games

    Awesome article.

    Feel free to visit my homepage billiard games play

    I am really pleased to read this webpage posts which contains tons of valuable data, thanks for providing
    such information.

    Here is my web page ... 8 ball pool game free online play

    Definitely believe that which you stated. Your favorite reason appeared to be on the internet the easiest thing to be
    aware of. I say to you, I definitely get irked while people think about worries that they just do not know about.
    You managed to hit the nail upon the top as well as defined out the whole thing without having side effect , people can take a signal.
    Will likely be back to get more. Thanks

    Stop by my web blog: uniforms for cheerleading

    I'm not sure exactly why but this web site is loading incredibly
    slow for me. Is anyone else having this issue or is it a issue on my end?
    I'll check back later and see if the problem still exists.


    my blog post: rules of playing pool 8 ball

    Hello there, just became alert to your blog through Google, and found
    that it is truly informative. I am gonna watch out for brussels.
    I'll be grateful if you continue this in future. Lots of people will be benefited from your writing.
    Cheers!

    Also visit my webpage ... billiard pool game

    It's not my first time to pay a quick visit this site,
    i am browsing this website dailly and get nice facts from here daily.



    Feel free to visit my blog post ... free billiards

    Wow, this post is pleasant, my sister is analyzing these kinds
    of things, therefore I am going to let know her.

    Feel free to surf to my website :: cheerleading supply

    Howdy this is kinda of off topic but I was wondering if blogs use WYSIWYG editors or if you have to manually code
    with HTML. I'm starting a blog soon but have no coding know-how so I wanted to
    get advice from someone with experience. Any help would be greatly appreciated!


    Also visit my web page; play online billiard

    Wow, wonderful blog layout! How long have you been blogging for?
    you make blogging look easy. The overall look of
    your website is excellent, let alone the content!


    my blog; 8 pool free download

    Wow, wonderful blog layout! How long have you been blogging for?
    you make blogging look easy. The overall look of your website is excellent, let alone the content!


    My homepage: 8 pool free download

    Hi there, I enjoy reading through your article post.
    I like to write a little comment to support you.

    my blog - pool table games free

    Post a Comment

    All types of Comments are welcome