Emoticon for Blogger version 3

Update the newest link to js file:


https://sites.google.com/site/gman/file/Emoticon.js?20110731

Emoticon for blogger

… is an easy way to show emoticons (smileys) in your blog posts or your comments. You and your readers just need to type the symbol :) and it will automatically change to :) when the post published.
Here is the list I already made:
Emoticon Symbols Emoticon Symbols
:) :) 8-X 8-X
:bz :bz *-:) *-:)
:D :D ~O) ~O)
^#(^ ^#(^ (~~) (~~)
x_x x_x **== **==
:!! :!! ~:> ~:>
\m/ \m/ :(|) :(|)
:-bd :-bd 3:-O 3:-O
:-q :-q :@) :@)
>:) >:) %-( %-(
#:-S #:-S :-?? :-??
:-S :-S :o3 :o3
B-) B-) <):) <):)
~:> ~:> >:P >:P
X( X( :-w :-w
:-O :-O :^o :^o
=(( =(( @-) @-)
:-* :-* #-o #-o
:P :P :-? :-?
:"> :"> (:| (:|
~X( ~X( <:-P <:-P
:)] :)] 8-} 8-}
:-c :-c :O) :O)
=; =; :-& :-&
:-B :-B :-$ :-$
O:-) O:-) [-( [-(
=)) =)) %%- %%-
/:) /:) @};- @};-
:| :| :-< :-<
:)) :)) :-SS :-SS
:(( :(( =D> =D>
:( :( =P~ =P~
:-h :-h (*) (*)
:-t :-t :-j :-j
8-> 8-> ^:)^ ^:)^
I-) I-) :-@ :-@
8-| 8-| ;)) ;))
L-) L-) >:/ >:/
>:D< >:D< \:D/ \:D/
;;) ;;) [-X [-X
[-O< [-O< :)>- :)>-
:-L :-L b-( b-(
>-) >-) :-" :-"
=:) =:) $-) $-)
(%) (%) o=> o=>
o-+ o-+ o-> o->
:x :x ;) ;)
:-/ :-/

In this update

You can separate the “emoticon region” into any ID or class. For example:
#comment-block or .entry-content
It’s way convenient for everyone :D
For those who installed the older versions of this hack, you don’t need to do anything for uninstalling. But of course, you can clean your template by remove the link to emoticon.js and onload=”replaceText()”, it is totally optional.

Steps:

Update: I've changed the link to js file, due to the migration of Google Pages (to Google Sites).

You can see more details how to install this hack here

(My) ToDo

  1. When you type “)” followed by “&” or “>” or “<” it will be changed to ;).
  2. And I haven’t made a way to escape emoticons :D
If you know a way to do this, please tell me how :">, thank you.

84 comments:

  1. Cám ơn Gman, chúc em thành công hơn nữa.

    ReplyDelete
  2. If you have any difficulty while install this, feel free to comment :D

    ReplyDelete
  3. Sao chị làm cách cổ điển thì được mà cách này ko được Gman? Cảm ơn em.

    ReplyDelete
  4. chà...cách cũ làm đã okie... thử hàng mới coi sao ! thanks Gman nha

    ReplyDelete
  5. chà...nó k hiện bác gman à... chép đúng như link hướng dẫn,,,

    ReplyDelete
  6. bác cho em cái link, em check thử xem sao.
    regards

    ReplyDelete
  7. ủa link là blog của e đó...
    http://mjning.com
    hoặc http://mjning.blogspot.com

    bác coi giúp em xem...e chỉ chèn đoạn code trc /head và 1 đoạn trước /html ...hay /body thì cũng thế nhỉ

    trong hướng dẫn chỉ ghi vậy

    ReplyDelete
  8. à, trường hợp của bác là vì bác dùng template đã sửa, mấy cái tên đã thay đổi rồi
    bác có thể khắc phục bằng cách sửa phần code thứ 2 lại thành

    addSmileyByClass('commentlist');
    addSmileyByClass('centry');

    ReplyDelete
  9. vấn đề là chỗ đó đó Gman...
    không rõ commentlist và centry có đúng k?
    tớ thử lại vẫn chưa ổn

    ReplyDelete
  10. để mai mình trả lời nhé, sáng mai phải thi rồi :-s giờ ngồi học bài cái đã

    ReplyDelete
  11. bạn ơi cho hỏi
    mình làm theo hướng dẫn chèn code bên web này http://sites.google.com/site/gman/blogger/emoticon
    vì code của bạn mình chèn nó cứ báo lỗi hoài
    nhưng muốn nhờ bạn xem giùm cái code ở link trên sao mình sửa nó chỉ hiện emoticons ở khung comment , còn nếu muốn hiện ở trong bài viết luôn thì làm sao

    ReplyDelete
  12. mình xin trả lời:
    thứ nhất, web đó cũng là của mình.

    thứ hai, bạn không hiện đc vì cái phần nội dung bài viết của bạn (http://www.tuannam.net) có classname là 'post-body'
    Để nó hiện ra, bạn phải sửa đoạn code đó lại
    từ
    addSmileyByClass('entry-content');
    thành

    addSmileyByClass('post-body');

    chúc bạn thành công
    thanks

    ReplyDelete
  13. cảm ơn bạn rất nhiều , mình mới vừa chuyển qua blogger nên chưa rành , bạn có nick YH ko , mình add làm quen có gì trao đổi

    ReplyDelete
  14. bạn có thể add nick mình [gmanvn]

    ReplyDelete
  15. Chào bạn, mình làm như hướng dẫn nhưng chỉ hiện emoticon ở comment, còn trên bài post thì nó không hiện, chỉ hiện ký tự như lúc type.

    ReplyDelete
  16. bạn phải xem xem cái phần post entry của bạn có cái class hay ID gì. Thường thì nó hay có class='post-body' hoặc class='entry-content' (tùy vào template bạn chọn)

    bạn có thể tìm bằng cách vào layout, chọn view expand widget template và tìm tới đoạn <data:post.body/>
    thường thì nó sẽ ghi cái tên class ngay trên dòng đó.

    sau khi có đc tên class (hoặc tên ID) bạn sửa lại dòng
    addSmileyByClass('entry-content');
    cho phù hợp (nhớ bỏ vào 2 dấu nháy)
    Nếu đó là ID thì bạn thay bằng
    addSmileyByID('post-body');


    ---
    Tóm lại bạn cần làm 2 thứ:
    1. tìm xem phần bạn muốn hiện emoticon có ID hay class là gì
    2. thêm (sửa) câu lệnh
    addSmileyByClass('entry-content');
    lại cho phù hợp

    Good luck

    ReplyDelete
  17. Chào bạn. Emoticons cũng ko hiện trên blog của mình. Mong bạn kiểm tra giúp mình, vì mình cũng rất dốt HTML :(
    Tks nhiều.
    Blog mình đây: quantraxinh.blogspot.com

    ReplyDelete
  18. mình đã thử sửa lại phần code thứ 2 như bạn nói, đã thay ID và class ở code 2 bằng ID và class trong template của mình (là comments-block và entry - không biết có đúng không?), nhưng nó vẫn không hoạt động.
    Bạn giúp mình xem lại được không?
    Xin lỗi đã làm phiền. Tks.

    ReplyDelete
  19. mình thấy blog bạn hiện emoticon rồi mà?

    ReplyDelete
  20. Đâu có, mình kiểm tra rồi mà. Hay là tại mình đang dùng IE?

    ReplyDelete
  21. có lẽ là vậy, mình ko chắc IE dưới version 6 chạy đc. 7, 8 thì mình test rồi và thấy ok. Chrome, FF thì khỏi nói

    ReplyDelete
  22. nhưng mà bạn thấy emo trên trang này mà phải ko? :-?

    ReplyDelete
  23. nice to meet you...
    saloom from bandung blogger Indonesian...
    your tutorial article veri interest...
    ciauw...^_^

    ReplyDelete
  24. nice to meet you, too
    does it work for you?

    ReplyDelete
  25. its work my friend, and i am used ID Name on my post side is Blog1...
    thanks...salom from bandung blogger Indonesian...

    ReplyDelete
  26. new link for JS file: http://sites.google.com/site/gmanvn/javascript/__Emoticon.js

    ReplyDelete
  27. oke bro \:D/ thanks for new link...and for comments, i am used ID comment-form :D

    ReplyDelete
  28. I'm not sure about "comment-form". It should be the form for you to compose comments only. It's not the area that comments appear.

    ReplyDelete
  29. There was an emoticon codes clashed with retweet code...hmmm...
    for unique code i think all different on template

    ReplyDelete
  30. ones more my frined...widget add this no good...

    ReplyDelete
  31. can you give me the link to that page. I can edit the code. The crash, I think, because of some HTML matches with a certain emoticon.

    ReplyDelete
  32. see this until right loading pages
    http://beben-koben.blogspot.com/2010/03/hack-request-1.html
    look at the right corner, and comment box...hurry

    ReplyDelete
  33. this hack is work my friend, on my post and comment side...but if finis of loading this is happen (on my blog)...
    http://i39.tinypic.com/2wec1tf.jpg

    ReplyDelete
  34. Hey Beben, I think I found the cause. It's because you use the incorrect class name and ID for post content and comment block.

    As I research from your blog,
    1. The right class name for comments is: 'commentlist'
    2. You put "share area" inside post content. To fix it, you should cover your pure content by a new name (I'll show you how)

    So, what you have to do is:
    1. Open your template, check 'expand widget templates'
    2. Find the line:
    <data:post.body/>

    3. Change it to
    <div class='post-body'><data:post.body/></div>

    4. Replace your addSmileyBy... to
    addSmileyByClass('commentlist');
    addSmileyByClass('post-body');
    5. Save your template and check if it works

    ReplyDelete
  35. any third <data:post.body/> on my template...all that use like you order?

    ReplyDelete
  36. it's woooooooooooooorkkkkk
    i add all on <div class='post-body'> </div> on my <data:post.body/>...
    thanks a lot my friend...this hack will i review...mauch :-* muach :-* :P

    ReplyDelete
  37. hmmm...any trouble anymore my friend...
    on my post if i use frame...this is be like that on pic to be cbox...hiks :(

    ReplyDelete
  38. if have load full one page post, multi tab not use too my friend :D, and fram will be frame cbox

    ReplyDelete
  39. hihihihi :D
    http://i43.tinypic.com/5x1ook.png

    ReplyDelete
  40. It still works for me. I found no problem.
    I'm using Firefox and Chrome.

    ReplyDelete
  41. oh .. may be lag on my place..:D
    sorry, my bandwith limited edition =))
    thanks my friends...i'll review it ;)

    ReplyDelete
  42. HIHIHIHI :D
    http://beben-koben.blogspot.com/2010/03/emoticon-for-blogger-volume-v3.html

    ReplyDelete
  43. i'll review, why my post on main page be 1 post...:-s

    ReplyDelete
  44. it is very good. I like so much. http://nvdinh88.blogspot.com

    ReplyDelete
  45. Cảm ơn bạn rất nhiều nhé :) :P

    ReplyDelete
  46. code này còn phải chỉnh sửa nhiều :D

    ReplyDelete
  47. bạn ơi cho mình hỏi tại sao mình làm đúng như vậy mà vẫn không có tác dụng vậy
    site mình đây ryuumic-infinity.blogspot.com

    ReplyDelete
  48. mình xem qua thì tại bạn chưa nhúng file js vào. mình thấy bạn có link tới 1 file smiley.js gì đó nhưng file đó không truy cập được.
    :D không có file js đó thì ko chạy được

    ReplyDelete
  49. May I grow and modify it?? I still will insert the source (this blog).

    ReplyDelete
  50. @Muhammad: Of course, it's open

    ReplyDelete
  51. sao mình làm trên blog của mình khi save thì nó báo ko thể lưu mẫu của bạn ~X(~X(

    ReplyDelete
  52. bạn đưa link cho mình xem thử

    ReplyDelete
  53. Hi All. Mình mới tạo thủ thuật đưa biểu tượng cảm xúc vào bài viết và nhận xét Blogger hoạt động tốt trên mọi trình duyệt. Mời mọi người cho ý kiến nhé.

    http://huynh-nhat-ha.blogspot.com/2010/11/emoticons-for-blogger-posts-and.html

    ReplyDelete
  54. cách này có áp dụng được cho comment kiểu IntenseDebate không bạn ơi, tại mình cài comment này :)
    với lại mình làm theo cách này thì emo hiển thị tốt mỗi tội các emo nó cứ hiển thị viền bóng lên (kiểu 3d) chứ không trong suốt như thế kia, chắc tại mình chọn giao diện như thế, nhưng làm sao để khắc phục mà không phải thay đổi sang giao diện khác.

    ReplyDelete
  55. bạn cho mình cái link blog của bạn đi để mình coi dùm cho

    ReplyDelete
  56. bạn thêm style là
    .post-body img {
    -webkit-box-shadow: none;
    }

    vào là đc

    ReplyDelete
  57. Chào bạn, mình làm theo http://blog.tungv.com/2007/12/emoticon-cho-blogger-updated.html
    Sau đó mình đọc bài này thấy ghi update,
    mình thay link http://site.gman.googlepages.com/Emoticon.js bằng link mới cập nhật tại bài viết này, mình không rõ còn phải làm thêm gì nữa không ? Mình không hiểu rõ nội dung update.

    Hiện giờ việc này chỉ tạo emoticons trong phần comment chứ khi viết bài muốn tạo emoticons mình vẫn phải dùng add-on firefox: greasemonkey để add emoticons

    ReplyDelete
  58. chào bạn mình đã làm theo link hướng dẫn này http://blog.tungv.com/2007/12/emoticon-cho-blogger-updated.html
    và thay đổi đường link mới cập nhật tại bài viết này, mình muốn hỏi xem phiên bản cập nhật của bạn ở đây có phải thay đổi thêm gì nữa không ?

    Những emoticons này chỉ thích ứng với comment-form chứ còn bài viết thì chưa được hiển thị.

    ReplyDelete
  59. Mình chỉ có thể hiện được emoticons với http://site.gman.googlepages.com/Emoticon.js, còn link cập nhật của bạn thì ko dùng được

    ReplyDelete
  60. chào bạn không biết bạn đã làm theo hướng dẫn ở link sau chưa?

    http://sites.google.com/site/gman/blogger/emoticon

    ReplyDelete
  61. hướng dẫn ở link http://sites.google.com/site/gman/blogger/emoticonlà bổ sung hay mới hoàn toàn ?? Vì mình thử mà thấy chỉ có cách cũ là được thôi

    ReplyDelete
  62. Quỷ biết bài hướng dẫn này qua PTS. Thanks bạn và PTS nhé,
    Lúc đầu Quỷ làm cái này qua bài http://sites.google.com/site/gman/blogger/emoticon.
    Tuy nhiên dùng link http://host.tungv.com/javascripts/__Emoticon.js thì ko hiện thị, Quỷ tải và chuyển qua https://sites.google.com/site/conquydo07/Home/__Emoticon.js để thay thế thì ngon rồi.
    Vài lời chia sẻ cho các bạn chưa làm được thử giống mình xem nhé.

    Welcome ti Conquydo07.: www.Conquydo07.tk

    ReplyDelete
  63. Liên kết bạn nhé. Rất vui được liên kết

    Title: Conquydo07
    URL: www.conquydo07.tk

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

    ReplyDelete
  65. mình thấy blog bạn hiện emoticon rồi mà? '

    ReplyDelete

You can use some HTML tags, such as <b>, <i>, <a>