Tiện ích Emoticons 'Bình cũ rượu mới' cho Blogspot

Tiện ích Emoticons dường như đã quá quen thuộc với chúng ta và hầu hết các bạn cũng đã biết các kí tự :) :( :v... là các biểu tượng cảm xúc gì đúng không nào? Vậy vì sao lại là "Bình cũ rượu mới"? Ở đây vẫn với các thao tác cơ bản để thêm các emoticons nhưng sẽ có nhiều chọn lựa cho các bạn với nhiều style emoticons .

Được tích hợp và trở thành một phần không thể thiếu được của các phần mềm chat như Yahoo! Messenger, Facebook, Zalo,... tiện ích emoticons được phát triển không ngừng, từ chỗ chỉ là những kí hiệu đơn giản nay đã lên đến những tổ hợp phức tạp hơn, đại diện cho nhiều loại cảm xúc khác nhau được thể hiện ra bằng hình ảnh động.

Bài viết này sẽ giới thiệu tới các bạn tiện ích emoticons cho Blogspot với nhiều style emoticons khác nhau cho các bạn dễ dàng chọn lựa và áp dụng cho blog của mình.

I. Thêm css cho tiện ích emoticons cho Blogspot

Bước 1: Vào Mẫu > Chỉnh sửa HTML

Bước 2: Chèn đoạn css sau trên </style>

.DBemoWrap {
  font:bold 12px Tahoma,Arial,Sans-Serif;
  text-align:center;
  position: relative;
  z-index: 99999;
}
img.emo, input.DBemoKEY {
  display:inline-block; 
  *display:inline;
  vertical-align:middle;
}
input.DBemoKEY {
  border:1px solid #ccc;
  background-color:white;
  font:bold 11px Arial,Sans-Serif;
  padding:1px 2px;
  margin:0px 0px 0px 2px;
  color:black;
}

Xem thêm:  Những tiện ích bài viết gần đây ít được chia sẻ

II. Các style cho tiện ích emoticons

Chèn các Js dưới các style lên trên thẻ </body>

1. Style emoticons Facebook

<script type='text/javascript'>
//<![CDATA[
eval((function(){var u=[74,94,60,86,89,79,65,81,90,87,72,70,66,80,82,76,75,71,88,85];var a=[];for(var v=0;v<u.length;v++)a[u[v]]=v+1;var t=[];for(var s=0;s<arguments.length;s++){var l=arguments[s].split('~');for(var q=l.length-1;q>=0;q--){var d=null;var i=l[q];var m=null;var r=0;var w=i.length;var h;for(var n=0;n<w;n++){var e=i.charCodeAt(n);var p=a[e];if(p){d=(p-1)*94+i.charCodeAt(n+1)-32;h=n;n++;}else if(e==96){d=94*(u.length-32+i.charCodeAt(n+1))+i.charCodeAt(n+2)-32;h=n;n+=2;}else{continue;}if(m==null)m=[];if(h>r)m.push(i.substring(r,h));m.push(l[d+1]);r=n+1;}if(m!=null){if(r<w)m.push(i.substring(r));l[q]=m.join('');}}t.push(l[0]);}var c=t.join('');var z='abcdefghijklmnopqrstuvwxyz';var b=[126,96,42,92,39,10].concat(u);var o=String.fromCharCode(64);for(var v=0;v<b.length;v++)c=c.split(o+z.charAt(v)).join(String.fromCharCode(b[v]));return c.split(o+'!').join(o);})('var _$_9195=["#comments p, div.D@semo@prap","iframe#comment-editor","Ch@du1ec9 vào icon @du0111@du1ec3 xem kí t@du1ef1 !","@idiv style=@d"text-align:center@d" class=@d"D@semo@prap@d"> :v :3 :D :| :@du2665 :@l :@! :7 :) :p :9 -_- ;) :( :khoc :)) :kt :td :likJ=beforJ= @iimg src=@J=@e class=@eemo delay@voad@e alt=@J=@e title=@J=@e />","replaceJ7@hJ7=J7;J7:J;ml","eachJ,J"J!4fJ11J9DJ;tps://lh5.googleusercontent.com/-pEM@x@pa5@ljM0/@j29EzCjbz@yI/J*m@x_0/@xqu0yrrn@x5ki8fm89o5yp4m@q@q@q@v@m@saz6wC@vc@s/s1600/pacmanJ9vJ;tps://lh5.googleusercontent.com/-ls@m3fe@mM884/@j29Eyud@s@poI/J*m@x_o/j5tN@q45w8@mk@my@j@m1Eu7@uI@g@p@u1@uqs6@v@p5wC@vc@s/s1600/3J93J,J"J!bfJ52cJ9|J,J"J!2J1dJ9@du2665J,J"J!2cJ531J9@lJ,J"J!14J528J9@!J,J"J!f4J517J97J,J"J!4J1fJ9)J,J"J!a1J51dJ9pJ,J"J!0J1bJ99J,J"J!eeJ511.png","-_-J,J"J!57J19.png",";)J,J"J!a3J51fJ9(J,J"J!40J52dJ9khocJ,J"J!d0J12J9))J,J"J!32J537J9ktJ,J"J!10J524J9tdJ;tps://lh5.googleusercontent.com/-@u7@vxd2r@nihM/@j29EysTg@u@lI/J*m@x_k/nCMTs1Ngm5EIC@omp5f@x5@vEE@s@pN@w@z9@khh@mC@vc@s/s1600/likeJ9J<J)J(J#fa1/J&851585_387545554704662_1461411912J2hahaJ)J(J#af1/J&11057086_789355287820052_1582909769J2ombung",":hayJ)J(J#fa1/J&11057103_789355331153381_925532673J2unlikeJ)J(J#ft1/J&10956906_789355317820049_834121535J2timtim","click","onJ=div.@sSemo@prap"];var emo@uange=J:0],D@sEmo@mbove=J:1],emoMessage=J:2];$(J8){$(D@sEmo@mbove)J64]](J:3]);var a=J8a,c,b){$(emo@uange)J615]](J8){$(this)J614]]($(this)J614]]()[J%:J.13])[J%;J.12])[J%=J.11])[J%@d@hJ.10])J69]](a,J:5]+ c+ J:6]+ b+ J:7]+ b+ J:8]))})};a(/@d:DJ-16J017J4vJ-18J019J43J-20J021J/|+J.22J02J3♥J-24J025J4@lJ-26J027J/@!+J.28J029J47J-30J031J/)+J.32J03J3pJ-34J035J49J-36J037]);a(/@d-_-J-38J039]);a(/@d;@d)+J.40J041J/(+J.42J04J3khocJ-44J045J/)@d)+J.46J047J4ktJ-48J049J4tdJ+0J051J4J<J+2J05J3hahaJ+4J055J4ombungJ+6J057J4hayJ+6J058J4unlikeJ+9J060J4timtimJ-61J062]);$(J:65])J664]](J:63],J8){if(emoMessage){alert(emoMessage)}})})~J"a~ages/emoji.php/v5/z~ww.facebook.com/im~d.net/hphotos-ak-x~J(d~J:9]](/@ibr>~t39.1997-6/p64x64/~J)-~-dragon-a.akamaih~J;tps://fbcdn~@m@m@m@m@m@m@m@~J-5~J;tps://w~/ig,J:~/g,J:~J4@d~],J:~J50~_nJ9~3J4~]);a(/@d:~/1/16/1f6~[J:~","@ibr> ~function(~.png",":~_$_9195[~","ht~like~e","'));
//]]>
</script>

2. Style emoticon Zingme

<script type='text/javascript'>
//<![CDATA[
eval((function(){var o=[82,65,71,86,72,89,66,88,80,87,90,81,94,60,75,85,79,74,76,70];var f=[];for(var i=0;i<o.length;i++)f[o[i]]=i+1;var c=[];for(var j=0;j<arguments.length;j++){var g=arguments[j].split('~');for(var k=g.length-1;k>=0;k--){var h=null;var l=g[k];var n=null;var m=0;var q=l.length;var z;for(var y=0;y<q;y++){var r=l.charCodeAt(y);var a=f[r];if(a){h=(a-1)*94+l.charCodeAt(y+1)-32;z=y;y++;}else if(r==96){h=94*(o.length-32+l.charCodeAt(y+1))+l.charCodeAt(y+2)-32;z=y;y+=2;}else{continue;}if(n==null)n=[];if(z>m)n.push(l.substring(m,z));n.push(g[h+1]);m=y+1;}if(n!=null){if(m<q)n.push(l.substring(m));g[k]=n.join('');}}c.push(g[0]);}var b=c.join('');var w='abcdefghijklmnopqrstuvwxyz';var e=[126,39,92,42,96,10].concat(o);var d=String.fromCharCode(64);for(var i=0;i<e.length;i++)b=b.split(d+w.charAt(i)).join(String.fromCharCode(e[i]));return b.split(d+'!').join(d);})('var _$_fae6=["#comments p, div.D@mR2prap","iframe#comment-editor","Ch@cu1ec9 vào icon @cu0111@cu1ec3 xem kí t@cu1ef1 !R3tdiv style=@c"text-align:center@c" class=@c"D@mR2prap@c"> :j 8@d :w :D ;? :mm @!@! ;S :@cu2665 @o( @n) ;8 -_- :) ;love :khoc ;v","before"," @timg src=@bR3b class=@bemo delay@yoad@b alt=@bR3b title=@bR3b />","replaceR*@sR*=R*;R*:","html","eachR&R R-14R/DR&R R-21R/jR&R R-45R/wR&R R-55R18@dR&R R,3R/?R&R R,R/@cu2665R&R R-50R1@o(R&R R-52R1@n)R&R R-1R/)R&R R,6R1;8",";SR&R R-42R/mmR&R R-41R1-_-R&R R,5R1@!@!R&R R-67R1;love",":likeR&R R-6R/khocR&R fun/53.gif",";v","click","one","div.@mSR2prap"];var R2gange=R.0],D@mEmo@hbove=R.1],emoMessage=R.2];$(R+){$(D@mEmo@hbove)R(4]](R.3]);var a=R+a,c,b){$(R2gange)R(15]](R+){$(this)R(14]]($(this)R(14]]()R!:R$13])R!;R$12])R!=R$11])R!@c@sR$10])R(9]](a,R.5]+ c+ R.6]+ b+ R.7]+ b+ R.8]))})};a(/@c:DR#16R%17R\'jR#18R%19R\'wR#20R%21R08@c@d+R$22R%23R)@c?+R$24R%25R\'♥R#26R%27R0@o@c(+R$28R%29R0@n@c)+R$30R%31R\'@c)+R$32R%33R)8R#34R%35R)SR#34R%36R\'mmR#37R%38R0-_-R#39R%40R0@!@c@!+R$41R%42R)loveR"3R%44R\'likeR"3R%45R\'khocR"6R%47R)vR"8R%49]);$(R.52])R(51]](R.50],R+){if(emoMessage){alert(emoMessage)}})})~/emo.me.zdn.vn/emo/~R(9]](/@tbr>~R#4~/ig,R.~/g,R.~],R.~","http:/~R0:~[R.~R0;~R3tbr> ~function(~R-3~default/~_$_fae6[~R1:~]);a(/@c~.jpg","~emo@~","@'));
//]]>
</script>

Sẽ update các style khác sau :)