Blogger
Chia sẽ bộ emotion cho phần comment tuyệt đẹp
Chào các bạn, đối với nhiều bạn thường xuyên bình luận trên blog của mình thì ắt hẳn đã từng nhìn thấy và sử dụng các icon để bình luận rồi chứ!? Với yêu cầu của bạn Thịnh Nguyễn (blogspotvn.com), th…
Chào các bạn, đối với nhiều bạn thường xuyên bình luận trên blog của mình thì ắt hẳn đã từng nhìn thấy và sử dụng các icon để bình luận rồi chứ!? Với yêu cầu của bạn Thịnh Nguyễn (blogspotvn.com), thì hôm nay mình viết bài này để hướng dẫn các bạn chèn bộ icon tuyệt đẹp lấy cảm hứng từ Facebook này vào Blogspot. Code do mình lấy từ blog Duy Phạm (duy-pham), icon thì mình lấy từ Facebook.
Kéo xuống phần bình luận bên dưới để trải nghiệm ngay nhé, nếu thấy thích thì áp dụng ngay vào blog luôn cho thêm chuyên nghiệp!!
Bước 1: Đăng nhập Blogger Mẫu Chỉnh sửa HTML.
Bước 2: Chèn đoạn javascript dưới đây vào trước thẻ </body> trong template.
Bước 3: Chèn đoạn sau vào nơi bạn muốn hiển thị khung emoticon.
Có thể chèn trước đoạn code sau vào trước đoạn code tìm kiếm phía trên
Bước 4: Lưu template.
Áp dụng ngay nào các bạn, quá đẹp luôn đúng không!?
Cảm ơn bác Duy Phạm (duy-pham) đã hỗ trợ code.
Kéo xuống phần bình luận bên dưới để trải nghiệm ngay nhé, nếu thấy thích thì áp dụng ngay vào blog luôn cho thêm chuyên nghiệp!!
Bước 1: Đăng nhập Blogger Mẫu Chỉnh sửa HTML.
Bước 2: Chèn đoạn javascript dưới đây vào trước thẻ </body> trong template.
<script>//<![CDATA[
// Shared by http://www.bomkhung.info
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('2r 2x="5p & 5o 2m 5q 5t 5s 5n://5m.5h",2z=[{2h:"/2H",2d:"2i://2.2e.2a.2b/-5g/5f/5j/5l-5k-5u/2g/2j-5v-2H-2f-2a-2b.2c"},{2h:"==",2d:"2i://3.2e.2a.2b/-5E/5G/5H/5D/2g/2j-5C-2f-2a-2b.2c"},{2h:"/2w",2d:"2i://3.2e.2a.2b/-5x-0/5d/4R/4P/2g/2j-2w-2f-2a-2b.2c"},{2h:"/g",2d:"2i://3.2e.2a.2b/-4J/4I/4H/4L/2g/4M-2f-2a-2b.2c"},{2h:";)",2d:"2i://3.2e.2a.2b/-4W-58/57/5b/G-5S/2g/5R-2f-2a-2b.2c"},{2h:"^.^",2d:"2i://3.2e.2a.2b/-61/63/6e/6d-6f-6g/2g/6i-2f-2a-2b.2c"},{2h:"/f",2d:"2i://4.2e.2a.2b/-6h/6c/6b/66-4G/2g/64-2f-2a-2b.2c"},{2h:"/r",2d:"2i://2.2e.2a.2b/-67/68/6a/-69/2g/2j-6Q-4A-2f-2a-2b.2c"},{2h:"^-^",2d:"2i://3.2e.2a.2b/-3s/3r/3t/3u/2g/2j-2l-3v-2p-2f-2a-2b.2c"},{2h:"/3q",2d:"2i://2.2e.2a.2b/-3p/3k/3j/3l/2g/2j-3m-3o-2f-2a-2b.2c"},{2h:"-.-",2d:"2i://2.2e.2a.2b/-3n/3w/3x/3G/2g/2j-3F-3H-3I-2f-2a-2b.2c"},{2h:"/o",2d:"2i://3.2e.2a.2b/-3J/3E/3D/3z/2g/2j-2s-2u-3i-3A-2f-2a-2b.2c"},{2h:":))",2d:"2i://4.2e.2a.2b/-3B/3C/3K/3f/2g/2j-2l-2S-2f-2a-2b.2c"},{2h:":)",2d:"2i://1.2e.2a.2b/-2R/2U/2Q/2T/2g/2j-2l-2O-2f-2a-2b.2c"},{2h:":((",2d:"2i://2.2e.2a.2b/-2N/2J/2I/2K/2g/2j-2L-2M-2P-3h-2f-2a-2b.2c"},{2h:":(",2d:"2i://3.2e.2a.2b/-3d/3c/3e/2V/2g/2j-3g-2f-2a-2b.2c"},{2h:":D",2d:"2i://2.2e.2a.2b/-3b/3a/2X/-2W/2g/2j-2l-2Y-39-2f-2a-2b.2c"},{2h:"=))",2d:"2i://1.2e.2a.2b/-3y/4F/4m/4o-3L/2g/2j-2l-4q-4l-2p-2f-2a-2b.2c"},{2h:":o",2d:"2i://3.2e.2a.2b/-4k/4g/4f/4h-4i/2g/2j-2s-2u-2f-2a-2b.2c"},{2h:"^2v^",2d:"2i://1.2e.2a.2b/-N-4s/4B/4C/4D/2g/2j-2l-4E-4z-2f-2a-2b.2c"},{2h:"-2v-",2d:"2i://2.2e.2a.2b/-4u/4t/4v/4w/2g/2j-4x-4e-4d-2f-2a-2b.2c"},{2h:"(y)",2d:"2i://3.2e.2a.2b/-3V/3U/3W/3X-3Y/2g/2j-65-2f-2a-2b.2c"},{2h:"(3)",2d:"2i://2.2e.2a.2b/-2Z/4n/4p/4j-4r/2g/2j-4y-3S-2f-2a-2b.2c"},{2h:":3",2d:"2i://4.2e.2a.2b/-3R/48/4a/Y-4b/2g/2j-2p-4c-2f-2a-2b.2c"},{2h:":v",2d:"2i://4.2e.2a.2b/-2C/2B/2D/2G-2F/2g/2j-2A-2y-2f-2a-2b.2c"},{2h:":V",2d:"2i://4.2e.2a.2b/-2C/2B/2D/2G-2F/2g/2j-2A-2y-2f-2a-2b.2c"},{2h:":p",2d:"2i://3.2e.2a.2b/-45/44/43/41-42/2g/2j-2l-46-47-2f-2a-2b.2c"}],2t=["2c","49","40","3Z","3Q","3P","3O","3M","3N","3T"],2k=[\'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}}};\',"|","5Q","||||||||||5P|5M||||||5N|||5O|5T|5U|5Z|60|5Y|5X|5V|5W|6j|6k|6G|6H|||6F|6E|6C|6D|2q|6I|6J|6O|6P|6N|6M|6K|6L|6B|6A|6q|6r|2r|6p|6o|6l|2m|2d|6m|6n|6s|2t|||||||||||6t|6y|6z|6x|6w|6u|6v|5L|5K|53|54|2z|52|51|4Y|4Z|50|55|56|26|5c|5a|59|23|30|4X|29|31|38|4N|35|37|2x|4K|34|28|36|33|32|4O|27|4U|4V|4T|4S|4Q|24|25|5e|5A|5B|5z|||","","5y","5w","\\\\w+","\\\\b","g"];5I(2o(a,i,o,m,e,p){2q(e=2o(a){2n(i>a?2k[4]:e(5J(a/i)))+(35<(a%=i)?2E[2k[5]](a+29):a.5F(36))},!2k[4][2k[6]](/^/,2E)){2m(;o--;)p[e(o)]=m[o]||e(o);m=[2o(a){2n p[a]}],e=2o(){2n 2k[7]},o=1}2m(;o--;)m[o]&&(a=a[2k[6]](5i(2k[8]+e(o)+2k[8],2k[9]),m[o]));2n a}(2k[0],62,5r,2k[3][2k[2]](2k[1]),0,{}));',62,425,'||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||blogspot|com|png|img|bp|blogttcn|s1600|text|https|icon|dp|cuoi|for|return|function|mat|if|var|ngac|type_img|nhien|_|ok|copyright|man|smileys|pac|WHTnevhjp6I|ZXiklf3RP7Y|AAAAAAAACUE|String|S01kdBs6kbGFatECgCLcB|8FdQ2hGAVMMvwfw|hi|AAAAAAAACTk|WHTndYMzY2I|8FX8pJHdfaUAKpxlk5dQmTnJnohuf3VDQCLcB|khoc|mot|DWDSdGErhuw|mim|dong|AAAAAAAACTQ|1oM_TE5VfbU|lon|9rRLfcfYKlYW5M7ZHIlkeij9VHPMTUqtQCLcB|WHTncvNBORI|JHTPfRRTac04Y1Im8nJK3wUZdcWHNLR6gCLcB|Mp4Tf2HrHAJ0h8WcNVmJnBuvHdRbXxKQCLcB|AAAAAAAACTU|nhe|UzK_X8UMjRk||||||||||rang|WHTncp4PXfI|PVBIliYz67o|WHTnbloHYEI|r7szGiJPRW4|AAAAAAAACS8|CbeflLmiwswbStXvdskh9GM8BKYHAPYIgCLcB|buon|song|hoang|AAAAAAAACUM|WHTnfKGkEnI|tlmiSemEFx0BpKmdeaUrVEy9iw7bodp7ACLcB|vo|qu98DTf0jVo|tay|qVt33tDzEjk|clap|WHTndHQYshI|s8ctkdgok3E|AAAAAAAACTc|X_zzwmr8HYscUN1kAr8w6nn3DRZrbgy8gCLcB|tit|WHTnblrPacI|AAAAAAAACTA|Cec2pPubVOc|SqdfwoADabMT44EQ99Ae4oKJIE09uSMbwCLcB|mang|MvpmHqY81vg|WHTncOUc90I|AAAAAAAACT8|WHTneZRbRdI|chay|_gKer8Nimzkv8dB2VO_212b56x08792YgCLcB|mo|hoi|dLQZY9F2Rgw|AAAAAAAACTM|wCLcB|GIF|bmp|gif|JPEG|jpeg|7XRq9qSBmNQ|tim|BMP|WHTnd4eTHJI|2iyJ877TTfw|AAAAAAAACTw|zo|2Qam5gd4M6CwtW06xkTjHyQvUNElYgCLcB|JPG|jpg|RlJsk8ua|FMy2HYLOWfIqpZACdMag3u5QCLcB|AAAAAAAACTE|WHTncESnKGI|2rfPgFZUQ1c|le|luoi|WHTnd8kHqDI|PNG|AAAAAAAACT4|oWhfNHaBEeeGTeeSBPtUav6K9KWFNcgCLcB|meo|long|hai|AAAAAAAACT0|WHTnd6kNQsI|5AHLbo1rVVUsx7|wF5Q9svhOMTeTzSNTgCLcB|NCQDl_nuhuArNjkhzMul1G|uNPH8DfKccM|nuoc|AAAAAAAACTY|WHTne6ws5EI|EUhUYSgrE_gFbrM8_wkWVbBphvc0FWo|AAAAAAAACUI|ra|e_7pfCMcXQCLcB|9a8JIJ1Rw|WHTndg61xpI|PdYIkQ1TlTQ|AAAAAAAACTo|7HvIzDRxmWwizkw4XNXHziYmUei9dJc6ACLcB|khong|trai|co|ngang|WHTncBwOW0I|AAAAAAAACTI|Azfkbn34DOgQeJV6CfYNpxY76ViE4T2VACLcB|mac|WHTnc_21m3I|Hhgu4roACLcB|AAAAAAAACWQ|WHzb9U28KLI|zVDDwHkIJ4E|x43|3G2Qunlbza8aNHpwjZM0rScW1YxFEwZwgCLcB|4emoticon|x6B|x71|4zxoidiXZQQDxU22B2DFnn97GsBCDlN5wCLcB|x4C|AAAAAAAACUA|x31|x25|x3B|x32|Atbet|x49|a2|x34|cbef|aft_nct2|aft_nct1|aft_nct3|m_l|x26|cL|WHzb9a62gsI|GzQXs|cbef2|x42|AAAAAAAACWI|cbef3|WHTnevNlwQI|x4E|WHTndFOTkfI|LuPjeIPajCI|info|RegExp|AAAAAAAACTg|gheeiR4AIAX3UI3vGTsVaK9dKu|Yum|duypham|http|Multimedia|Emoticons|Thread|127|by|Comment|jACLcB|hello|replace|RLbdmcajB|fromCharCode|x4F|x48|document|angry|rptz1JXzcU4k5wtDUflKXigB15OP949awCLcB|z89lvV3G1wM|toString|WHTnbg4LfjI|AAAAAAAACS4|eval|parseInt|a1|dot_png|x74|x65|x61|_0xf28e|split|3emoticon|J67WEx4WkgL0nsKfSCr97R0ZrwTUNVQCLcB|x72|x6D|x20|x6C|x69|x22|x2F|x68|N52zwdjsG3g||WHzb9wgsbzI|2emoticon|like|ihDBd07fNssoNpeJQBaIXw9X|130QOfdenN4|WHTndoBraQI|4i9OFkFfz8kGKuY9qlMPjpyWhuY8_TFgCLcB|AAAAAAAACTs|AAAAAAAACWM|WHzb9U_G5cI|yZT_cjOtYT4Po5|AAAAAAAACWU|1LRJVlzz31xpb|7jDwCLcB|hmjAxdkivPQ|emoticon|x63|x73|x78|x2D|aft_y2|else|x3A|x66|a3|aft_y3|aft_y1|x33|x76|x54|x3F|x45|x4D|x79|x2E|x70|x64|x3D|x6E|x77|x6F|x62|x75|youtube|x3E|x67|nct|x30|x3C|liec'.split('|'),0,{}))
//]]> </script>
Bước 3: Chèn đoạn sau vào nơi bạn muốn hiển thị khung emoticon.
<div class='comments-content'>
Có thể chèn trước đoạn code sau vào trước đoạn code tìm kiếm phía trên
<div class='comment_emo_list'>
<div class='item'><img class='comment_emo' src='https://1.bp.blogspot.com/-1oM_TE5VfbU/WHTncvNBORI/AAAAAAAACTQ/9rRLfcfYKlYW5M7ZHIlkeij9VHPMTUqtQCLcB/s1600/icon-cuoi-mim-blogttcn-blogspot-com.png' /><span> :)</span>
</div>
<div class='item'><img class='comment_emo' src='https://4.bp.blogspot.com/-MvpmHqY81vg/WHTncOUc90I/AAAAAAAACTM/CbeflLmiwswbStXvdskh9GM8BKYHAPYIgCLcB/s1600/icon-cuoi-lon-blogttcn-blogspot-com.png' /><span> :))</span>
</div>
<div class='item'><img class='comment_emo' src='https://2.bp.blogspot.com/-PVBIliYz67o/WHTncp4PXfI/AAAAAAAACTU/-Mp4Tf2HrHAJ0h8WcNVmJnBuvHdRbXxKQCLcB/s1600/icon-cuoi-nhe-rang-blogttcn-blogspot-com.png' /><span> :D</span>
</div>
<div class='item'><img class='comment_emo' src='https://1.bp.blogspot.com/-Cec2pPubVOc/WHTnc_21m3I/AAAAAAAACTY/EUhUYSgrE_gFbrM8_wkWVbBphvc0FWo-wCLcB/s1600/icon-cuoi-ra-nuoc-mat-blogttcn-blogspot-com.png' /><span> =))</span>
</div>
<div class='item'><img class='comment_emo' src='https://3.bp.blogspot.com/-r7szGiJPRW4/WHTnbloHYEI/AAAAAAAACS8/JHTPfRRTac04Y1Im8nJK3wUZdcWHNLR6gCLcB/s1600/icon-buon-blogttcn-blogspot-com.png' /><span> :(</span>
</div>
<div class='item'><img class='comment_emo' src='https://2.bp.blogspot.com/-DWDSdGErhuw/WHTndYMzY2I/AAAAAAAACTk/8FX8pJHdfaUAKpxlk5dQmTnJnohuf3VDQCLcB/s1600/icon-khoc-mot-dong-song-blogttcn-blogspot-com.png' /><span> :((</span>
</div>
<div class='item'><img class='comment_emo' src='https://3.bp.blogspot.com/-uNPH8DfKccM/WHTnd6kNQsI/AAAAAAAACT0/5AHLbo1rVVUsx7-wF5Q9svhOMTeTzSNTgCLcB/s1600/icon-ngac-nhien-blogttcn-blogspot-com.png' /><span> :o</span>
</div>
<div class='item'><img class='comment_emo' src='https://1.bp.blogspot.com/-N-9a8JIJ1Rw/WHTncBwOW0I/AAAAAAAACTI/Azfkbn34DOgQeJV6CfYNpxY76ViE4T2VACLcB/s1600/icon-cuoi-mac-co-blogttcn-blogspot-com.png' /><span> ^_^</span>
</div>
<div class='item'><img class='comment_emo' src='https://3.bp.blogspot.com/-s8ctkdgok3E/WHTndHQYshI/AAAAAAAACTc/X_zzwmr8HYscUN1kAr8w6nn3DRZrbgy8gCLcB/s1600/icon-cuoi-tit-mat-blogttcn-blogspot-com.png' /><span> ^-^</span>
</div>
<div class='item'><img class='comment_emo' src='https://4.bp.blogspot.com/-hmjAxdkivPQ/WHzb9U_G5cI/AAAAAAAACWM/ihDBd07fNssoNpeJQBaIXw9X-Hhgu4roACLcB/s1600/2emoticon-blogttcn-blogspot-com.png' /><span>/f</span>
</div>
<div class='item'><img class='comment_emo' src='https://3.bp.blogspot.com/-N52zwdjsG3g/WHzb9wgsbzI/AAAAAAAACWU/yZT_cjOtYT4Po5-1LRJVlzz31xpb-7jDwCLcB/s1600/emoticon-blogttcn-blogspot-com.png' /><span>^.^</span>
</div>
<div class='item'><img class='comment_emo' src='https://3.bp.blogspot.com/-zVDDwHkIJ4E/WHzb9U28KLI/AAAAAAAACWQ/3G2Qunlbza8aNHpwjZM0rScW1YxFEwZwgCLcB/s1600/4emoticon-blogttcn-blogspot-com.png' /><span>/g</span>
</div>
<div class='item'><img class='comment_emo' src='https://3.bp.blogspot.com/-Atbet-GzQXs/WHzb9a62gsI/AAAAAAAACWI/G-J67WEx4WkgL0nsKfSCr97R0ZrwTUNVQCLcB/s1600/3emoticon-blogttcn-blogspot-com.png' /><span>;)</span>
</div>
<div class='item'><img class='comment_emo' src='https://2.bp.blogspot.com/-PdYIkQ1TlTQ/WHTndg61xpI/AAAAAAAACTo/7HvIzDRxmWwizkw4XNXHziYmUei9dJc6ACLcB/s1600/icon-khong-hai-long-blogttcn-blogspot-com.png' /><span> -_-</span>
</div>
<div class='item'><img class='comment_emo' src='https://3.bp.blogspot.com/-z89lvV3G1wM/WHTnbg4LfjI/AAAAAAAACS4/rptz1JXzcU4k5wtDUflKXigB15OP949awCLcB/s1600/icon-angry-blogttcn-blogspot-com.png' /><span> ==</span>
</div>
<div class='item'><img class='comment_emo' src='https://2.bp.blogspot.com/-130QOfdenN4/WHTndoBraQI/AAAAAAAACTs/-4i9OFkFfz8kGKuY9qlMPjpyWhuY8_TFgCLcB/s1600/icon-liec-ngang-blogttcn-blogspot-com.png' /><span> /r</span>
</div>
<div class='item'><img class='comment_emo' src='//facebook.com/images/emoji.php/v6/zaa/1/32/1f613.png' /><span> -.-</span>
</div>
<div class='item'><img class='comment_emo' src='https://3.bp.blogspot.com/-2rfPgFZUQ1c/WHTncESnKGI/AAAAAAAACTE/RlJsk8ua-FMy2HYLOWfIqpZACdMag3u5QCLcB/s1600/icon-cuoi-le-luoi-blogttcn-blogspot-com.png' /><span> :p</span>
</div>
<div class='item'><img class='comment_emo' src='https://3.bp.blogspot.com/-dLQZY9F2Rgw/WHTneZRbRdI/AAAAAAAACT8/SqdfwoADabMT44EQ99Ae4oKJIE09uSMbwCLcB/s1600/icon-ngac-nhien-hoang-mang-blogttcn-blogspot-com.png' /><span> /o</span>
</div>
<div class='item'><img class='comment_emo' src='https://2.bp.blogspot.com/-LuPjeIPajCI/WHTndFOTkfI/AAAAAAAACTg/Yum-gheeiR4AIAX3UI3vGTsVaK9dKu-jACLcB/s1600/icon-hello-hi-blogttcn-blogspot-com.png' /><span> /hi</span>
</div>
<div class='item'><img class='comment_emo' src='https://3.bp.blogspot.com/-RLbdmcajB-0/WHTnevNlwQI/AAAAAAAACUA/4zxoidiXZQQDxU22B2DFnn97GsBCDlN5wCLcB/s1600/icon-ok-blogttcn-blogspot-com.png' /><span> /ok</span>
</div>
<div class='item'><img class='comment_emo' src='https://2.bp.blogspot.com/-qVt33tDzEjk/WHTnfKGkEnI/AAAAAAAACUM/tlmiSemEFx0BpKmdeaUrVEy9iw7bodp7ACLcB/s1600/icon-vo-tay-blogttcn-blogspot-com.png' /><span> /clap</span>
</div>
<div class='item'><img class='comment_emo' src='https://3.bp.blogspot.com/-2iyJ877TTfw/WHTnd4eTHJI/AAAAAAAACTw/zo-2Qam5gd4M6CwtW06xkTjHyQvUNElYgCLcB/s1600/icon-like-blogttcn-blogspot-com.png' /><span> (y)</span>
</div>
<div class='item'><img class='comment_emo' src='https://2.bp.blogspot.com/-UzK_X8UMjRk/WHTne6ws5EI/AAAAAAAACUI/NCQDl_nuhuArNjkhzMul1G-e_7pfCMcXQCLcB/s1600/icon-trai-tim-blogttcn-blogspot-com.png' /><span> (3)</span>
</div>
</div>
<style>.comment_emo_list{padding:10px 15px;clear:both;float:left}.comment_emo_list .item{float:left;text-align:center;height:40px;width:60px;margin:0;padding:10px 0 15px;transition:.33s;border-radius:50px}.comment_emo_list .item:hover{background:#eee}.comment_emo_list .item:hover span{color:#55579e}.comment_emo_list span{display:block;font-weight:500;font-size:14px;letter-spacing:0;color:#c7c7c7;transition:.33s}img.comment_emo{width:25px;height:25px;pointer-events:none;-webkit-user-select:none}</style>
<!-- // emoticon by bomkhung.info // -->
Bước 4: Lưu template.
Áp dụng ngay nào các bạn, quá đẹp luôn đúng không!?
Cảm ơn bác Duy Phạm (duy-pham) đã hỗ trợ code.
Previous post
Chia sẽ bộ emotion cho phần comment tuyệt đẹp
Related post
Hung.Pro.VN
Nhà thiết kế WebTôi là admin trang Hung.Pro.VN là một người có đam mê với Blogspot, kinh nghiệm 5 năm thiết kế ra hàng trăm mẫu Template blogpsot như" Bán hàng, bất động sản, landing page, tin tức...
DEMO CHO MỌI NGƯỜI TẠI ĐÂY :o
Trả lờiXóa