Chèn Emoticons vào bình luận Blog

Tiện ích Emoticons này là bản nâng cấp từ Blog Duypham đã được mình bổ xung thêm một số biểu tượng thêm phong phú.
Đặc biệt Tiện ích này hổ trợ chèn trực tiếp link Video trực tiếp từ Youtube, link hình có các đuôi như png, jpg, gif và bmp.
Bạn thực hiện như sau:
2- Vào phần Mẫu (Template)
3- Chọn Chỉnh sửa HTML
4- Chèn đoạn mã dưới đây trước thẻ </body>:
// Emoticons Update by TyniSoft
//<![CDATA[
var copyright='Emoticons & Multimedia for Thread Comment by http://duypham.info';
var smileys=[
{'text':':))','img':'http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vt_XVZKI/AAAAAAAAATI/Q35_W0anT6A/21.gif'},
{'text':':)','img':'http://lh6.ggpht.com/_u7a1IFxc4WI/TM-voiNIw2I/AAAAAAAAASw/aav2hwqeG0c/1.gif'},
{'text':':((','img':'http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vt5z16MI/AAAAAAAAATE/Hx-7Thmr6do/20.gif'},
{'text':':(','img':'http://lh6.ggpht.com/_u7a1IFxc4WI/TM-voq7QQnI/AAAAAAAAAS0/UzoFJOCcPPU/2.gif'},
{'text':':D','img':'http://lh3.ggpht.com/_u7a1IFxc4WI/TM-voxnkRKI/AAAAAAAAAS4/PjDn098vm3w/4.gif'},
{'text':'=))','img':'http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vuJ1G41I/AAAAAAAAATM/_jLHXvz6PTg/24.gif'},
{'text':'=D>','img':'http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vzUt1yQI/AAAAAAAAATY/QHNvnj0gYbU/41.gif'},
{'text':':-O','img':'http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vpLiW1GI/AAAAAAAAATA/fPyPJcBks7s/13.gif'},
{'text':':-?','img':'http://lh5.ggpht.com/_u7a1IFxc4WI/TM-vua5MF2I/AAAAAAAAATU/N4X-ouMd1-I/39.gif'},
{'text':':-SS','img':'http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vzUOH79I/AAAAAAAAATc/oNE5H5vcNtI/42.gif'},
{'text':':-t','img':'http://lh3.ggpht.com/_u7a1IFxc4WI/TM-vz4hwcNI/AAAAAAAAATo/4ySXuvQWma8/104.gif'},
{'text':'[-(','img':'http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vuMg6RQI/AAAAAAAAATQ/rWj7euuKOZs/33.gif'},
{'text':'@-)','img':'http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vziH8NXI/AAAAAAAAATg/2evEbN2cJwc/43.gif'},
{'text':'b-(','img':'http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vzrqI4MI/AAAAAAAAATk/BhfFnT0Gbro/66.gif'},
{'text':'=.=','img':'https://lh4.googleusercontent.com/_9-sNIAfGhKg/TXyK4vY1n3I/AAAAAAAAAIg/uyq9XnzO7iU/52.gif'},
{'text':'T_T','img':'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnybpT1ZyEzmLz4vbnRoPbsCwkctxAoe2KKw5Wjm3Mo7JQUXvHwawuk7ovahB49-x3Mgcp8aFyK6tQ0QhRewvNOL8cujhaqiC-vCOjOay-19nzoDxBQSTe7Q2QiiKCFgXZ5xzhkXh0FHka/'},
{'text':':ok','img':'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbJv2Ei9nIDRBkECCnrO7vxKR2IGNUplaevS7yvVibBzbIwkHtq6GdX6l_0FrUpo_YHstjCRv2fhc9VWkguWkWSTOjJfIlggKy0O0q4fS7qNTJRvfYHL3_jUn5ekbWAadea7oeKHX8WzZo/'},
{'text':':iou','img':'https://lh5.googleusercontent.com/_9-sNIAfGhKg/TXxptF1kJSI/AAAAAAAAAIY/oEhVU5Ne49U/yeulam.gif'},
{'text':':cdv','img':'https://lh4.googleusercontent.com/_9-sNIAfGhKg/TXyK41uQ_ZI/AAAAAAAAAIo/WFnc77M2sww/38.gif'},
{'text':':woa','img':'https://lh6.googleusercontent.com/-HUHxT4EOSOU/UlBKz_8GDNI/AAAAAAAABy4/vj7_fRq2jIs/s36/85.gif'},
{'text':':la','img':'https://lh5.googleusercontent.com/-BBV7mrokau8/UlBKzwVVDcI/AAAAAAAABy8/1hnpUgbLo3g/s36/67.gif'},
{'text':':x','img':'https://lh3.googleusercontent.com/_9-sNIAfGhKg/TXxpsb1FvKI/AAAAAAAAAIQ/mGikiSKPedg/soldierbaby.gif'},
{'text':':-d','img':'https://lh5.googleusercontent.com/-R7piU_aiQSs/UlDqCRvbfHI/AAAAAAAAB0Y/vPxnb9YxKRs/s36/5.gif'},
{'text':':bye','img':'https://lh3.googleusercontent.com/-XyiFQYIxQ9E/UlDt06AXbxI/AAAAAAAAB04/KbYXdbGROR0/s36/48.gif'},
{'text':';-(','img':'https://lh5.googleusercontent.com/-sZO0cHc2ekY/UlDovg4qJdI/AAAAAAAAB0I/3G7hdBieQpY/s36/1.gif'},
{'text':':mz','img':'https://lh5.googleusercontent.com/-uZaj4hR-308/UnziGjbufLI/AAAAAAAACNo/NcWMvxGxI38/s36/110.gif'},
{'text':'<3','img':'https://lh6.googleusercontent.com/-TO5fOOB_jF4/Uv-GHvtoz4I/AAAAAAAACaM/TkhK5NWg9mM/s36/102.gif'},
{'text':':P','img':'http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vpDb68dI/AAAAAAAAAS8/Yv0Uu3qzG_Q/10.gif'}];
var type_img=['png','PNG','jpg','JPG','jpeg','JPEG','gif','GIF','bmp','BMP'];
var dp=['Q a=["\\1b\\m\\w\\b\\q\\t\\w\\z\\u\\r\\1r\\r\\1c\\F\\s\\b\\q\\m\\h\\C\\q\\k\\r\\O\\w\\l\\r\\1e\\o\\l\\h\\k\\C\\r\\1H\\w\\m\\m\\h\\z\\b\\r\\E\\N\\r\\o\\b\\b\\B\\R\\n\\n","\\N\\B","\\q\\z\\O\\w","\\t\\w\\m\\m\\h\\z\\b\\W\\o\\w\\s\\C\\h\\l","\\J\\h\\b\\1b\\s\\h\\m\\h\\z\\b\\1v\\N\\1z\\C","\\B","\\J\\h\\b\\1b\\s\\h\\m\\h\\z\\b\\u\\1v\\N\\1e\\k\\J\\1W\\k\\m\\h","\\s\\h\\z\\J\\b\\o","","\\q\\z\\z\\h\\l\\1X\\1e\\1c\\1T","\\q\\b\\h\\m","\\o\\b\\b\\B","\\u\\B\\s\\q\\b","\\o\\b\\b\\B\\R\\n\\n\\v\\v\\v\\M\\N\\w\\F\\b\\F\\E\\h\\M\\t\\w\\m\\n\\v\\k\\b\\t\\o\\1d\\1g\\A","\\o\\b\\b\\B\\R\\n\\n\\v\\v\\v\\M\\z\\o\\k\\t\\t\\F\\k\\b\\F\\q\\M\\t\\w\\m\\n\\z\\J\\o\\h\\1d","\\M","\\q\\z\\C\\h\\T\\1Z\\O","\\u\\F\\E\\u\\b\\l\\q\\z\\J","\\r","\\H","\\H\\E\\l\\n\\L\\H\\E\\l\\n\\L\\H\\q\\m\\J\\r\\u\\b\\N\\s\\h\\A\\p\\m\\k\\T\\W\\v\\q\\C\\b\\o\\R\\1S\\G\\G\\1R\\p\\r\\u\\l\\t\\A\\p","\\p\\n\\L","\\1r","\\H\\E\\l\\n\\L\\H\\E\\l\\n\\L\\H\\q\\O\\l\\k\\m\\h\\r\\v\\q\\C\\b\\o\\A\\p\\1p\\G\\G\\p\\r\\o\\h\\q\\J\\o\\b\\A\\p\\1f\\1Q\\G\\p\\r\\u\\l\\t\\A\\p\\o\\b\\b\\B\\R\\n\\n\\v\\v\\v\\M\\N\\w\\F\\b\\F\\E\\h\\M\\t\\w\\m\\n\\h\\m\\E\\h\\C\\n","\\1d\\l\\h\\s\\A\\G\\p\\r\\O\\l\\k\\m\\h\\E\\w\\l\\C\\h\\l\\A\\p\\G\\p\\r\\k\\s\\s\\w\\v\\O\\F\\s\\s\\u\\t\\l\\h\\h\\z\\L\\H\\n\\q\\O\\l\\k\\m\\h\\L","\\H\\E\\l\\n\\L\\H\\E\\l\\n\\L\\H\\h\\m\\E\\h\\C\\r\\u\\b\\N\\s\\h\\A\\p\\v\\q\\C\\b\\o\\R\\1f\\G\\G\\B\\T\\1P\\o\\h\\q\\J\\o\\b\\R","\\1c\\A","\\1f\\G\\G","\\1p\\G\\G","\\B\\T\\p\\r\\u\\l\\t\\A\\p\\o\\b\\b\\B\\R\\n\\n\\v\\v\\v\\M\\z\\o\\k\\t\\t\\F\\k\\b\\F\\q\\M\\t\\w\\m\\n","\\m\\n","\\s\\n","\\p\\r\\O\\s\\k\\u\\o\\1g\\k\\l\\u\\A\\p\\k\\F\\b\\w\\u\\b\\k\\l\\b\\A\\O\\k\\s\\u\\h\\p\\r\\1N\\F\\k\\s\\q\\b\\N\\A\\p\\o\\q\\J\\o\\p\\r\\v\\m\\w\\C\\h\\A\\p\\b\\l\\k\\z\\u\\B\\k\\l\\h\\z\\b\\p\\r\\b\\N\\B\\h\\A\\p\\k\\B\\B\\s\\q\\t\\k\\b\\q\\w\\z\\n\\T\\W\\u\\o\\w\\t\\1D\\v\\k\\1g\\h\\W\\O\\s\\k\\u\\o\\p\\L\\H\\n\\h\\m\\E\\h\\C\\L","\\b\\h\\T\\b","\\H\\q\\m\\J\\r\\u\\l\\t\\A\\p","\\q\\m\\J","\\l\\h\\B\\s\\k\\t\\h","\\C\\F","\\o\\k\\m\\M"];Q V=[];K=[];I=[];1q=a[0];1w=a[1];1u=a[2];1s=1Y[a[4]](a[3]);c=1s[a[6]](a[5]);D(c){U(x=0;x<c[a[7]];x++){Q 1i=a[8];1o=a[8];P=a[8];d=c[a[10]](x)[a[9]];e=d[a[12]](a[11]);f=d[a[12]](a[13]);g=d[a[12]](a[14]);U(Q i=1;i<e[a[7]];i++){U(Q j=0;j<Z[a[7]];j++){1h=e[i][a[16]](a[15]+Z[j]);D(1h!=-1){V[i]=a[11]+e[i][a[17]](0,1h)+a[15]+Z[j];D((V[i][a[16]](a[18])==-1)&&(V[i][a[16]](a[19])==-1)){1i+=a[20]+V[i]+a[21]}}}};U(Q i=1;i<f[a[7]];i++){1a=f[i][a[16]](a[18]);X=f[i][a[16]](a[19]);D(1a!=-1){K[i]=f[i][a[17]](0,1a);Y=K[i][a[16]](a[19]);D(Y!=-1){K[i]=K[i][a[17]](0,Y)}}S{D(X!=-1){K[i]=f[i][a[17]](0,X)}S{D(i==f[a[7]]-1){K[i]=f[i][a[17]](0,d[a[7]])}}};K[i]=K[i][a[12]](a[22]);K[i]=K[i][0];1o+=a[1x]+K[i]+a[1U]};U(Q i=1;i<g[a[7]];i++){1m=g[i][a[16]](a[18]);1n=g[i][a[16]](a[19]);D(1m!=-1){I[i]=g[i][a[17]](0,1m);1j=I[i][a[16]](a[19]);D(1j!=-1){I[i]=I[i][a[17]](0,1j)}}S{D(1n!=-1){I[i]=g[i][a[17]](0,1n)}S{D(i==g[a[7]]-1){I[i]=g[i][a[17]](0,d[a[7]])}}};1k=I[i][a[17]](0,2);I[i]=I[i][a[17]](2,I[i][a[7]]);P+=a[1V];D(1k==a[1t]){P+=a[1O]}S{P+=a[1J]};P+=a[1A];D(1k==a[1t]){P+=a[1y]}S{P+=a[1B]};P+=I[i]+a[1M]};U(Q y=0;y<1l[a[7]];y++){d=d[a[1K]](1l[y][a[1L]],a[1I]+1l[y][a[1E]]+a[21])};D(1G==1q+a[1F]+1w+a[1C]+1u){c[a[10]](x)[a[9]]=d+1i+1o+P}}};',"|","split","||||||||||_0xf28e|x74||||||x65|||x61|x72|x6D|x2F|x68|x22|x69|x20|x6C|x63|x73|x77|x6F|||x6E|x3D|x70|x64|if|x62|x75|x30|x3C|nct|x67|youtube|x3E|x2E|x79|x66|a3|var|x3A|else|x78|for|img|x2D|aft_y2|aft_y3|type_img|||||||||||aft_y1|x45|x4D|x3F|x54|x33|x76|dot_png|a1|aft_nct3|m_l|smileys|aft_nct1|aft_nct2|a2|x34|cbef|x26|cL|26|cbef3|x42|cbef2|23|30|x49|29|31|38|x6B|35|37|copyright|x43|34|28|36|33|32|x71|27|x3B|x32|x25|x31|x4C|24|25|x4E|x48|document|x4F|||","","fromCharCode","replace","\\w+","\\b","g"];eval(function(d,e,a,c,b,f){b=function(a){return(a<e?dp[4]:b(parseInt(a/e)))+(35<(a%=e)?String[dp[5]](a+29):a.toString(36))};if(!dp[4][dp[6]](/^/,String)){for(;a--;)f[b(a)]=c[a]||b(a);c=[function(a){return f[a]}];b=function(){return dp[7]};a=1}for(;a--;)c[a]&&(d=d[dp[6]](RegExp(dp[8]+b(a)+dp[8],dp[9]),c[a]));return d}(dp[0],62,127,dp[3][dp[2]](dp[1]),0,{}));
//]]>
5- Tìm đến thẻ
<b:loop values='data:post.comments' var='comment'>Và thêm trước nó thẻ
<div id='emocomments'>6- Tìm thẻ đóng tương ứng với thẻ trên
</b:loop>- Và thêm sau nó thẻ
</div>7- Bước này là hiển thị những ký tự tắt và emoticons tương ứng với nó cho người đọc có thể biết được để chèn vào khung Nhận xét.
![]() |
Hình DEMO |
(Lưu ý: Tùy thuộc vào tác giả thiết kế mà Blog bạn gồm nhiều đoạn tương tự. Bạn đặc sao cho phù hợp với Blog của mình)
Và chèn đoạn mã dưới đây vào sau nó:
<script type='text/javascript'>8- Thêm một class emoticons. Chèn đoạn mã dưới vào trước thẻ ]]></b:skin>
//<![CDATA[
function moreSmilies() {
document.getElementById('smiley-more').style.display = 'inline';
document.getElementById('smiley-toggle').innerHTML = '<a href="javascript:lessSmilies()">←</a></span>';
}
function lessSmilies() {
document.getElementById('smiley-more').style.display = 'none';
document.getElementById('smiley-toggle').innerHTML = '<a href="javascript:moreSmilies()">→</a>';
}
//]]>
</script>
<div class='emocomments'>
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-voiNIw2I/AAAAAAAAASw/aav2hwqeG0c/1.gif'/>:)
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-voq7QQnI/AAAAAAAAAS0/UzoFJOCcPPU/2.gif'/>:(
<img src='http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vt_XVZKI/AAAAAAAAATI/Q35_W0anT6A/21.gif'/>:))
<img src='http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vt5z16MI/AAAAAAAAATE/Hx-7Thmr6do/20.gif'/>:((
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vuJ1G41I/AAAAAAAAATM/_jLHXvz6PTg/24.gif'/>=))
<span id='smiley-more' style='display: none;'>
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vzUt1yQI/AAAAAAAAATY/QHNvnj0gYbU/41.gif'/>=D>
<img src='http://lh3.ggpht.com/_u7a1IFxc4WI/TM-voxnkRKI/AAAAAAAAAS4/PjDn098vm3w/4.gif'/>:D
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vpDb68dI/AAAAAAAAAS8/Yv0Uu3qzG_Q/10.gif'/>:P
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vpLiW1GI/AAAAAAAAATA/fPyPJcBks7s/13.gif'/>:-O
<img src='http://lh5.ggpht.com/_u7a1IFxc4WI/TM-vua5MF2I/AAAAAAAAATU/N4X-ouMd1-I/39.gif'/>:-?
<img src='http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vzUOH79I/AAAAAAAAATc/oNE5H5vcNtI/42.gif'/>:-SS
<img src='http://lh3.ggpht.com/_u7a1IFxc4WI/TM-vz4hwcNI/AAAAAAAAATo/4ySXuvQWma8/104.gif'/>:-t
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vuMg6RQI/AAAAAAAAATQ/rWj7euuKOZs/33.gif'/>[-(
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vziH8NXI/AAAAAAAAATg/2evEbN2cJwc/43.gif'/>@-)
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vzrqI4MI/AAAAAAAAATk/BhfFnT0Gbro/66.gif'/>b-(
<img src='https://lh4.googleusercontent.com/_9-sNIAfGhKg/TXyK4vY1n3I/AAAAAAAAAIg/uyq9XnzO7iU/52.gif'/>=.=
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnybpT1ZyEzmLz4vbnRoPbsCwkctxAoe2KKw5Wjm3Mo7JQUXvHwawuk7ovahB49-x3Mgcp8aFyK6tQ0QhRewvNOL8cujhaqiC-vCOjOay-19nzoDxBQSTe7Q2QiiKCFgXZ5xzhkXh0FHka/'/>T_T
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbJv2Ei9nIDRBkECCnrO7vxKR2IGNUplaevS7yvVibBzbIwkHtq6GdX6l_0FrUpo_YHstjCRv2fhc9VWkguWkWSTOjJfIlggKy0O0q4fS7qNTJRvfYHL3_jUn5ekbWAadea7oeKHX8WzZo/'/>:ok
<img src='https://lh5.googleusercontent.com/_9-sNIAfGhKg/TXxptF1kJSI/AAAAAAAAAIY/oEhVU5Ne49U/yeulam.gif'/>:iou
<img src='https://lh4.googleusercontent.com/_9-sNIAfGhKg/TXyK41uQ_ZI/AAAAAAAAAIo/WFnc77M2sww/38.gif'/>:cdv
<img src='https://lh6.googleusercontent.com/-HUHxT4EOSOU/UlBKz_8GDNI/AAAAAAAABy4/vj7_fRq2jIs/s36/85.gif'/>:woa
<img src='https://lh5.googleusercontent.com/-BBV7mrokau8/UlBKzwVVDcI/AAAAAAAABy8/1hnpUgbLo3g/s36/67.gif'/>:la
<img src='https://lh5.googleusercontent.com/-R7piU_aiQSs/UlDqCRvbfHI/AAAAAAAAB0Y/vPxnb9YxKRs/s36/5.gif'/>:-d
<img src='https://lh5.googleusercontent.com/-sZO0cHc2ekY/UlDovg4qJdI/AAAAAAAAB0I/3G7hdBieQpY/s36/1.gif'/>;-(
<img src='https://lh3.googleusercontent.com/-XyiFQYIxQ9E/UlDt06AXbxI/AAAAAAAAB04/KbYXdbGROR0/s36/48.gif'/>:bye
<img src='https://lh3.googleusercontent.com/_9-sNIAfGhKg/TXxpsb1FvKI/AAAAAAAAAIQ/mGikiSKPedg/soldierbaby.gif'/>:x
</span>
<span id='smiley-toggle'><a href='javascript:moreSmilies()'>→</a></span>
</div>
.emoticons {-moz-background-clip: -moz-initial;-moz-background-origin: -moz-initial;-moz-background-inline-policy: -moz-initial;text-align: left;} .emoticons a, .emoticons a:hover {font-size: 28px;margin-left: 20px;text-decoration:none;}