How to add a unique set of Smileys/Emoticons in your Blogger blog

The ET smileys project kicked off when the Eternal Thinker blog wanted a custom set of emoticons in the blog posts.
After several requests from readers, I am sharing the free custom made smileys for Blogger with all of you! (These emoticons can also be used in Wordpress, Tumblr, or any other blog and website)

Now let your articles communicate more with these original cute smileys. The smiley set contains all the basic smileys plus a collection of interesting icons. You just need to type in the smiley symbol while writing the article, and they'll be converted to smiley images when it is published. Smileys will also display in the threaded comments in Blogger. ^_^ 


Main post content has been moved here

Note [28th May 2015]:
People who's been using et Smiley set already in their blog/website need to move to the newly hosted JavaScript files (check link above). As the earlier version is hosted in Google Code (which is scheduled to be shutdown soon), the smileys will stop working soon.

127 comments:

  1. Hmmm...very helpful post. Way to go Et! :)

    @Et I need your help on some coding. Will explain later.

    Toodles

    ReplyDelete
  2. Hey choco..and thanks to you!

    The smiley update was part of my early blog redesign plan, but somehow I got lazy at middle-way.I actually got the motivation to resume the work wen i saw smileys smiling at u'r blog. So thanks for the trigger!! :h

    n do lemem knw wat help u needed! :)

    ReplyDelete
  3. Aha! These smileys are indeed very useful. Good work. Need to explore your site for more such goodies.

    ReplyDelete
  4. Go on.. keep exploring..gud luck! :)

    ReplyDelete
  5. Hiii et, This is the First time i visited your Blog... Nice Blog Buddy.. & your Template is awesome

    Cheers,
    Kunal

    ReplyDelete
  6. Thanku kunal... :i
    Keep visiting!

    ReplyDelete
  7. Hey:)

    I've been having difficulty installing emoticon on my blog for a realllyyy long time,
    AND I STILL CANT GET IT! >:(

    I've tried following your ways,
    but I think there's something wrong with my encodding:(

    ReplyDelete
  8. @ dreaming angel
    Okey.. i looked up your 'smiley-tester' blog and saw why it doesn't work.
    The problem is that you put it before (head) tag
    You should move the code before (/head)
    ..replace '(' with '>'

    If you don't see the difference..
    There are two tags
    (head)and (/head)
    The code should be between these tags.Right now it is OUTSIDE them!

    I could've mailed this.But since i don't have your id..i'm posting here.Hope you see this.

    ReplyDelete
  9. So hey:)


    I know I'm suppose to put it before the "/head"
    but somehow it just isnt there:S

    ReplyDelete
  10. Hi ET.
    I found this website that shares cute emoticons for blogs.
    I downloaded one set and I am wondering how to use the ones I downloaded instead of the ones provided. Pls help :D
    Email: rening2107@hotmail.com

    Thanks

    ReplyDelete
  11. im using a custom template, so this isnt working.. but i didnt get wat u said abt the class n all.. i really need to place the smileys in the blog. please help.
    hw do u find the class names u mentioned..

    ReplyDelete
  12. Thank you very much for the smileys. After trying more than 5 sites sharing on the Smiley tips, this is the one which works :)

    ReplyDelete
  13. Could you add the class 'main' and 'blog-posts hfeed' in the script as I am using a custom template. Also, I have noticed that my infolinks doesn't work once this script loads up. I mean, those infolinks doesn't show any information on mouseover and even when someone clicks them, nothing happens. So could you fix it so that both can go hand in hand.

    ReplyDelete
  14. Thank you so much! Very cute smileys that looks good with most templates! 8)

    ReplyDelete
  15. dude can i get customised smileys matching my template?

    ReplyDelete
  16. Thank you. I hope that works with me.. :D

    ReplyDelete
  17. Thanks a lot....
    You are simply great!!

    ReplyDelete
  18. Hey et..I would love to have some of these smileys on my blog. But I want to keep my yahoo smileys too. Is that possible?
    Also I cannot understand the instructions. Call me daft. Help!

    :mj Couldn't resist :mj

    ReplyDelete
  19. hi et.i can put other smileys but not MJ.why? 'm dying to put MJ in my blog coz it looks cool :D

    ReplyDelete
  20. I have had the pencilling template for the past week now and it's just amazing :L

    I so love it..!!

    ReplyDelete
  21. thank youu very muchh ! muahkz ! :e

    ReplyDelete
  22. it's awesome dude... your blog is hot !! :P :e

    ReplyDelete
  23. Hi - many thanks for sharing this. I tried it on my new blog, but the background of my page is brown, not white, so your smilies come out looking square. Can you tell me how to hide the white edges?

    Many thanks :)

    ReplyDelete
  24. me too...there is border in smileys!! how can i hide that border/square??

    ReplyDelete
  25. @Dora @Popi
    Since most people are using light themes and dark themed blogs seem to be comfortable with the current smiley set, I haven't concentrated much on the issues in dark templates. i see that some smileys may need a retouch before they're ready to go in darker templates.
    I'll surely start working on a smiley set optimized for dark templates!

    ReplyDelete
  26. et, i succesfully can put tnis smile appear on my post, but why it doesn't appear in comment section? ouh..help me please, i want my blog's visitors enjoy it!

    ReplyDelete
  27. hi, i'm using blogspot, wand was trying to put the script into mine. But I can't find where it says < / head > .... what should I do? thank you!!

    ReplyDelete
  28. In firefox, or in most otherr browsers, u can take the blog source code and press Ctrl+F to get the search box. Search for < / head > there

    ReplyDelete
  29. Yea, I tried Ctrl F, but still cannot find any < / head> when I clicked on the "edit HTML" button. Is there anything else I should do??

    ReplyDelete
  30. Only thing I can say is, if your blog is working and showing up, then </head> must be there! Alternatively, you can search for <body> tag(which MUST be there in any case), and the </head> will be seen a little above.

    If that's not working, then you're not looking at the right place. Make sure it is Design -> Edit HTML in blogger dashboard.

    ReplyDelete
  31. Awesome!!!But it seems that the smiley is not working for my blog...=(

    ReplyDelete
  32. yay! thanx eternal thinker! it worked, yea, i was looking at the wrong place.... :)

    ReplyDelete
  33. I am not able to get smiliys in my blog though i have done everything but I have a custom template.
    This one.
    Name: Desktop Chaos
    Author: Klodian
    URL: www.deluxetemplates.net

    I can't find the javascript 3 lines code you mentioned above. what to do now?
    please tell me the way to use these smiliys.

    ReplyDelete
  34. hi et, i just downloaded your template and i love it :)
    but i should say that i want to deactivate the smileys set from my posts, although it's cute. is there any way to do that? thank u so much

    ReplyDelete
  35. @ arlene
    In the above post, I've menrioned the code required to Activate the smileys. So if you want to Deactivate them, just follow the above said procedure, but once you find the code, Remove it, so that the smileys shall disappear.

    ReplyDelete
  36. Hey et I am having custom blog template, and it seems .post is the class name for the post, can you tell me, how and where to call the java script??

    ReplyDelete
  37. hello i tried this but unfortunately, it doesn't work in my template.. can you help me.. please.. thank you

    ReplyDelete
  38. Thanks for this blog.. love the smileys.. :)

    check my blog candiceonloveandheartache.blogspot.com

    i wanna try the smileys for the comment part but i just don't know how to show the comment box eventhough i've embedded comment below post ... :(

    ReplyDelete
  39. hey really great blog, thanks for the cute smileys.. some of the smileys are very rare in u r blog. I am using this smileys in all my pages now... thanks...

    ReplyDelete
  40. I just loved what you published above, smiles are the best! I think it was an useful information and we can't ignore this kind of initiatives. 8)

    ReplyDelete
  41. Rahul,

    You will see a lots of comments from me today.

    So I am using your penciling template. Awesome template. But now I want the comment bubbles to have different background colours. Is it possible? Help!

    ReplyDelete
  42. @ Moumita

    Sorry for the late response!
    If you want to alter features of the design like the background colours, you need to get into a bit of HTML and CSS. Because for this kind of editing, we need to get down and dirty in teh codez!

    You can change the background image used for the comment bubble, and mention it in the code.

    ReplyDelete
  43. Cool! im an emoticons addict!! :r

    ReplyDelete
  44. Et, im confuse with my costume template code.. here:

    < div id='content-wrapper' >
    < div id='content-wrap' >
    < div id='main-wrapper' >

    can u help me how to change it?

    ReplyDelete
  45. Your script code is already changed and different with last version? coz my smiley cannot be seen! and I tride to add your new script code into my HTML.

    but still not working!! what should I do?? :c please help me!! please visit my blog to see what happened! :b

    ReplyDelete
  46. @Popi
    I checked your blog titled 'CINTA DAMAI' and found that you've included some other smiley script before the et smileys.
    Check your blogger code for this part:
    http://louislim2.googlepages.com/addSmiley.js

    Try removing that code and see how it works. For now, a few smileys are working correctly.

    The code I provide is different from the last version. But it is perfectly compatible with all the old versions.

    ReplyDelete
  47. hey i couldn't find the "head" how do i get it? and some of my smiley didn't show the picture. help

    ReplyDelete
  48. @woopsy
    Did you get to the Blog's HTML code?
    Use Ctrl+F shortcut in browser to get the search option and use it to find head tag.

    Not all the smileys appearing has to do with wrong usage of smiley symbols or lack of a blank space before the smiley symbol.

    ReplyDelete
  49. Thank you so much for the help on smileys, it worked first time!! :party

    ReplyDelete
  50. The heart smiley is not working on my blog :|
    Any ideas how to fix that?
    The others are working properly as I can see....

    ReplyDelete
  51. Hello et!
    Your smileys are awesome. :star This is a very useful post. :tup Thank you. :)
    Now my blog is wearing your batch of smileys. ^_^

    ReplyDelete
  52. This comment has been removed by the author.

    ReplyDelete
  53. Ok, it's all working now. Buuuuuut: When I activate the Website Feed and put the subscription gadget into the sidebar, the smiley list above the comment form disappears.
    Any clues or hints upon that? That's driving me nuts. I went through the whole code but couldn't figure out where the fault was.

    ReplyDelete
  54. how to take this simbol to the blog? :/

    ReplyDelete
  55. Could you modify it to work on other non blog related sites like weebly? (although I know that weebly has blog support, I want to use it for the website)
    :)

    ReplyDelete
  56. Thanks for your smiley set.

    I don't know why blogspot doesn't include a set of its own :/

    Regards.

    ReplyDelete
  57. This comment has been removed by the author.

    ReplyDelete
  58. Hi there! The smileys don't show up in the mobile version of my Blogger blog, is there any way I can make them work there too?
    Thanks!

    ReplyDelete
  59. This comment has been removed by the author.

    ReplyDelete
  60. HI!

    Great Job!! I´ve been looking for the way to put smileys in my blog for hours . The script works perfectly, thanks.

    Now, I have a little question.

    Could I have the code of the script? I would like to put my eyes on it and I´m thinking about adding more images and re-uploading it to my server to use them.

    Thank you. And again, great job!! :tup

    ReplyDelete
  61. Hey, it amazing ! :D
    Can you teach me the way to use my own emoticons in the blogger by using this method ?
    Can you please send the solution to my gmail?
    wincci.go@gmail.com
    Thanks alot ! :O waiting for your reply ~~!:$

    ReplyDelete
  62. OMG!! I was looking for these smileys, and I didn't know they were called "et" :o
    I'm so trying to add this to mi blog! :D
    Thank you so much for sharing!! <3

    ReplyDelete
  63. well. I'm back. A couple os smileys doesn't work on my blog, like: xP :~ :brow :kitten ... and others.... any idea why??

    ReplyDelete
  64. Thanks for the emoticons! :D
    These are very cute~

    ReplyDelete
  65. Hi Et, seem it's not working on my template blogger. Help pls Et.. :(
    I've been trying to change this code : div id="custom-content", but I failed to find it. How come?

    Thanks Et :)

    ReplyDelete
    Replies
    1. Hi feni,

      Your custom template might be having a different set of CSS IDs and classes. If you are having trouble finding the individual classes, you can always add the 'etSmileys' class to the <body> tag as:
      <body class='etSmileys'>

      Delete
    2. Hi Rahlul thank for replying, there's no such code as < body >. What should I do? Thanks in advance! :) :)

      Delete
    3. Feni, in your blog (one linked to your above username) I see this code:
      <body class='loading'>

      You can alter this as below and try:
      <body class='loading etSmileys'>

      Make sure you have added the smiley script as per the above blog post!

      Delete
    4. It works. Thank youuuu! :D

      Delete
  66. This comment has been removed by the author.

    ReplyDelete
  67. It Works..!! Great... Thanks...!! :-)

    ReplyDelete
  68. OMG! This actually works and they are sooo adorable too! Thank you so much! Finally I have found an actual emoticon code that works!!! WooooHooooo! <3 :)

    ReplyDelete
  69. How can I create my own set of smileys and add to my blog? Please.
    Or how can I put the 'Emoji Smileys' in my blog? :(
    Please , i need help !!
    Thanks, x

    ReplyDelete
  70. I do not have a custom template and I have included the tag you have provided. However, smileys are not reflected in the content of my blog. Do I need to do anything else ? Please help.

    ReplyDelete
  71. Hello, could anyone here tell me how to change the code so that a space is not needed before the symbol of the smiley if possible please? I would really like to use this without a space before the symbol...

    ReplyDelete
  72. This comment has been removed by the author.

    ReplyDelete
    Replies
    1. This comment has been removed by the author.

      Delete
  73. Wow! This is cool, unique and excellent emoticons. A great to spend time to read and share to my folks. Continue posting good article like this that really helps to make research easily get what they need.
    Mogicons

    ReplyDelete
  74. The latest 3D animated film
    watch and support they give me.
    thank you much
    Cartoon

    ReplyDelete
  75. I found this website that shares cute emoticons for blogs.
    บาคาร่า
    gclub จีคลับ
    gclub casino

    ReplyDelete
  76. https://site-2448571-8744-5071.mystrikingly.com/blog/the-best-camera-phone-in-2021
    https://www.evernote.com/shard/s334/sh/e16d8332-c4cb-813a-f8c7-a66e2f98f477/e6c7aeb8acc9421449baef18b34fa822
    https://isshumittal.livejournal.com/303.html

    ReplyDelete
  77. https://www.vingle.net/posts/3849686
    https://www.apsense.com/article/what-is-machine-learning-why-is-machine-learning-important.html

    ReplyDelete
  78. Hey friend, it is very well written article, thank you for the valuable and useful information you provide in this post. Keep up the good work! FYI, How to know if your dog is having a heat stroke , IDFC FIRST Classic Credit Card review
    , I am not your perfect Mexican daughter pdf download,How to be a good citizen paragraph

    ReplyDelete
  79. พบกับ สล็อตเครดิตฟรี ไม่ต้องฝาก ไม่ต้องแชร์ สนุกกับเกมสล็อตได้ไม่รู้จบ เล่นสนุกแบบจุใจ ไม่มีเบื่อ มีให้คุณได้เลือกเล่นมากมายมากกว่า 200 เกม

    เว็บสล็อตที่เป็นที่นิยมมากที่สุด การันตีด้วยจำนวนผู้เล่นที่เข้ามาใช้บริการกับ สล็อตเว็บตรงไม่ผ่านเอเย่นต์ ด้วยมาตรฐานการให้บริการที่โดดเด่น อัปเดตระบบให้ทันสมัยมากขึ้นอยู่เสมอ

    ผู้ให้บริการ เว็บสล็อต ออนไลน์ ที่ดีที่สุดในประเทศไทย แตกง่ายฝากถอนรวดเร็วทันใจ ระบบทันสมัยปลอดภัยใส่ใจในการบริการ

    ReplyDelete
  80. This comment has been removed by the author.

    ReplyDelete
  81. รวมโปรสล็อต แหล่งรวมโปรสล็อต สำหรับนักเดิมพันที่ชื่นชอบในการเล่นสล็อตออนไลน์ ค่ายเกมที่โปรโมชั่นเยอะและดีที่สุด
    โปรสล็อต แหล่งรวมโปรโมชั่นเด็ด ในการเล่นเกมสล็อตออนไลน์ ถอนได้ไม่อั้น ไม่มีจำกัด
    รวมโปรทุนน้อย เล่นฟรีได้เงินจริง 2022 ยูสเดียวเล่นได้ทุกค่าย ถอนไม่อั้น ไม่มีจำกัด สล็อตเว็บตรงไม่ผ่านเอเย่นต์ เล่นได้ทุกค่าย

    ReplyDelete
  82. เว็บสล็อตที่เป็นที่นิยมมากที่สุด การันตีด้วยจำนวนผู้เล่นที่เข้ามาใช้บริการมี เกมสล็อตฟรี มากมายให้เล่นไม่อั้น ด้วยมาตรฐานการให้บริการที่โดดเด่น อัปเดตระบบให้ทันสมัยมากขึ้นอยู่เสมอ
    รวมโปรสล็อตถอนไม่อั้น สุดยอดเว็บเกมสล็อตยอดนิยม ที่รวมเกมสล็อตจากค่ายดังไว้เยอะที่สุด ให้คุณได้ประทับใจไปกับรางวัลภายในเกมที่มีแจกแบบไม่อั้น มาพร้อมกับ โปรสล็อตสมาชิกใหม่100 ถอนไม่อั้น
    สล็อตแตกง่าย เกมสล็อตออนไลน์ เกมเดิมพันออนไลน์ยอดฮิตที่ได้รับความนิยม มีให้คุณได้เลือกเล่นมากมายมากกว่า 200 เกม

    ReplyDelete
  83. Mega Game เว็บตรง สล็อตแตกง่าย สมัครฟรี ทุนน้อยก็เล่นได้ เดิมพันกับค่าย เมก้าสล็อต รับรางวัลแจ็คพอตสุดพิเศษ
    Megaslot ค่ายเกม pigpin เกมสล็อตออนไลน์ ใหม่ล่าสุด แตกง่าย เว็บไซต์สล็อตที่มั่งคั่งทุกการพนันสล็อตออนไลน์

    ReplyDelete
  84. Emogi is a very good icons which represent the emotion in a text manner

    ReplyDelete
  85. Since 1829, buses have been a common form of transportation in London. Despite this, buses have managed to stay current, making bus tours one of the greatest choices for sightseeing in London city today. In central London, tour buses—the majority of which are open-top vehicles—are a common sight. These double-decker buses provide tourist services with either live or recorded commentary and have an upper deck that is either totally or partially open. Most of these services allow passengers to enter and depart at any of the bus line's stops and continue their journey on a different bus.

    ReplyDelete