Widget (Tiện ích) "List comment" for blogger update 2015

Để biết trang web của mình có lượng người dùng ổn định và xem tương tác ra sao chúng ta cần chú ý nhiều yếu tố. Một trong số đó là lượng người dùng thường xuyên và có để lại những bình luận trao đổi cũng như góp ý giúp cho website của bạn có thể cải thiện cho phù hợp với người dùng hơn tăng tỉ lệ giữ lại người xem cho blog (website) của bạn.

Giúp cho website cụ thể hơn là blog của các bạn xây dựng trên nền tảng blogger có thêm nhiều lựa chọn thời gian tới Thucle Blogs sẽ cố gắng sưu tầm và tổng hợp các mã code hay để chia sẻ cho các bạn.

Mở đầu series là bài viết giới thiệu đến các bạn một đoạn code hiển thị danh sách bình luận mới nhất giúp bạn tăng khả năng tương tác với độc giả hơn

Tiện ích này rất dễ cài đặt và cấu hình gồm hai đoạn mã

1: Chèn code javascript cấu hình widget

Đây là đoạn mã:

<script> var _0x826a=["\x68\x74\x74\x70\x3A\x2F\x2F\x6E\x61\x6D\x6B\x6E\x61\x2E\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D\x2F","\x63\x6F\x6D\x6D\x65\x6E\x74\x73\x2D\x63\x6F\x6E\x74\x61\x69\x6E\x65\x72","\x20\x4B\x6F\x6D\x65\x6E\x74\x61\x72\x20\x42\x61\x72\x75\x21","\x67\x65\x74\x54\x69\x6D\x65","\x73\x65\x74\x54\x69\x6D\x65","\x3B\x20\x65\x78\x70\x69\x72\x65\x73\x3D","\x74\x6F\x47\x4D\x54\x53\x74\x72\x69\x6E\x67","","\x63\x6F\x6F\x6B\x69\x65","\x3D","\x3B\x20\x70\x61\x74\x68\x3D\x2F","\x3B","\x73\x70\x6C\x69\x74","\x6C\x65\x6E\x67\x74\x68","\x73\x75\x62\x73\x74\x72\x69\x6E\x67","\x63\x68\x61\x72\x41\x74","\x20","\x69\x6E\x64\x65\x78\x4F\x66","\x73\x65\x74","\x74\x74\x5F\x63\x6D","\x67\x65\x74","\x74\x69\x74\x6C\x65","\x75\x6E\x64\x65\x66\x69\x6E\x65\x64","\x68\x65\x61\x64","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x73\x42\x79\x54\x61\x67\x4E\x61\x6D\x65","\x73\x63\x72\x69\x70\x74","\x63\x72\x65\x61\x74\x65\x45\x6C\x65\x6D\x65\x6E\x74","\x74\x79\x70\x65","\x74\x65\x78\x74\x2F\x6A\x61\x76\x61\x73\x63\x72\x69\x70\x74","\x69\x64","\x63\x6D\x2D\x66\x65\x65\x64\x2D\x73\x63\x72\x69\x70\x74","\x73\x72\x63","\x68\x6F\x6D\x65\x5F\x70\x61\x67\x65","\x2F\x66\x65\x65\x64\x73\x2F\x63\x6F\x6D\x6D\x65\x6E\x74\x73\x2F\x64\x65\x66\x61\x75\x6C\x74\x3F\x61\x6C\x74\x3D\x6A\x73\x6F\x6E\x2D\x69\x6E\x2D\x73\x63\x72\x69\x70\x74\x26\x72\x65\x64\x69\x72\x65\x63\x74\x3D\x66\x61\x6C\x73\x65\x26\x6D\x61\x78\x2D\x72\x65\x73\x75\x6C\x74\x73\x3D","\x6D\x61\x78\x5F\x72\x65\x73\x75\x6C\x74","\x26\x63\x61\x6C\x6C\x62\x61\x63\x6B\x3D\x73\x68\x6F\x77\x52\x65\x63\x65\x6E\x74\x43\x6F\x6D\x6D\x65\x6E\x74\x73","\x61\x70\x70\x65\x6E\x64\x43\x68\x69\x6C\x64","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x42\x79\x49\x64","\x72\x65\x6D\x6F\x76\x65\x43\x68\x69\x6C\x64","\x70\x61\x72\x65\x6E\x74\x4E\x6F\x64\x65","\x69\x6E\x74\x65\x72\x76\x61\x6C","\x65\x6E\x74\x72\x79","\x66\x65\x65\x64","\x6F\x70\x65\x6E\x53\x65\x61\x72\x63\x68\x24\x74\x6F\x74\x61\x6C\x52\x65\x73\x75\x6C\x74\x73","\x61\x6C\x65\x72\x74","\x6E\x65\x77\x5F\x63\x6D","\x28","\x29\x20","\x3C\x75\x6C\x20\x63\x6C\x61\x73\x73\x3D\x22\x63\x6D\x2D\x6F\x75\x74\x65\x72\x22\x3E","\x6C\x69\x6E\x6B","\x72\x65\x6C","\x61\x6C\x74\x65\x72\x6E\x61\x74\x65","\x68\x72\x65\x66","\x2F","\x6C\x61\x73\x74\x49\x6E\x64\x65\x78\x4F\x66","\x2E","\x6A\x6F\x69\x6E","\x2D","\x26\x68\x65\x6C\x6C\x69\x70\x3B","\x61\x75\x74\x68\x6F\x72","\x24\x74","\x6E\x61\x6D\x65","\x2E\x24\x31","\x72\x65\x70\x6C\x61\x63\x65","\x2F\x73","\x74\x5F\x77","\x24\x31","\x67\x64\x24\x69\x6D\x61\x67\x65","\x75\x72\x69","\x23\x6E\x6F\x70\x65","\x76\x61\x6C\x75\x65","\x67\x64\x24\x65\x78\x74\x65\x6E\x64\x65\x64\x50\x72\x6F\x70\x65\x72\x74\x79","\x63\x6F\x6E\x74\x65\x6E\x74","\x6E\x65\x77\x5F\x74\x61\x62\x5F\x6C\x69\x6E\x6B","\x20\x74\x61\x72\x67\x65\x74\x3D\x22\x5F\x62\x6C\x61\x6E\x6B\x22","\x73\x75\x6D\x6D\x61\x72\x79","\x3C\x6C\x69\x3E","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x63\x6D\x2D\x68\x65\x61\x64\x65\x72\x22\x3E\x3C\x73\x74\x72\x6F\x6E\x67\x3E\x3C\x73\x70\x61\x6E\x20\x63\x6C\x61\x73\x73\x3D\x22\x74\x65\x6E\x74\x61\x63\x67\x69\x61\x22\x3E\x3C\x61\x20\x68\x72\x65\x66\x3D\x22","\x22\x20\x74\x69\x74\x6C\x65\x3D\x22","\x22","\x3E","\x3C\x2F\x61\x3E\x3C\x2F\x73\x70\x61\x6E\x3E\x20\u0110\u0103\x6E\x67\x20\x6E\x67\xE0\x79\x20\x20","\x20\x74\u1EA1\x69\x3A\x20\x3C\x73\x70\x61\x6E\x20\x63\x6C\x61\x73\x73\x3D\x22\x74\x65\x6E\x74\x61\x63\x62\x61\x69\x76\x69\x65\x74\x22\x3E\x3C\x61\x20\x63\x6C\x61\x73\x73\x3D\x22\x74\x69\x65\x75\x64\x65\x62\x61\x69\x64\x61\x6E\x67\x22\x20\x68\x72\x65\x66\x3D\x22","\x3C\x2F\x61\x3E\x3C\x2F\x73\x70\x61\x6E\x3E\x3C\x2F\x73\x74\x72\x6F\x6E\x67\x3E\x3C\x2F\x64\x69\x76\x3E","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x63\x6D\x2D\x63\x6F\x6E\x74\x65\x6E\x74\x22\x3E\x3C\x61\x20\x68\x72\x65\x66\x3D\x22","\x3E\x3C\x69\x6D\x67\x20\x61\x6C\x74\x3D\x22\u0110\x61\x6E\x67\x20\x74\u1EA3\x69\x20\u1EA3\x6E\x68\x2E\x2E\x2E\x22\x20\x73\x74\x79\x6C\x65\x3D\x22\x77\x69\x64\x74\x68\x3A","\x70\x78\x3B\x68\x65\x69\x67\x68\x74\x3A","\x74\x5F\x68","\x70\x78\x3B\x22\x20\x73\x72\x63\x3D\x22","\x22\x3E\x3C\x2F\x61\x3E","\x3C\x73\x70\x61\x6E\x20\x63\x6C\x61\x73\x73\x3D\x22\x63\x6D\x2D\x74\x65\x78\x74\x22\x3E\x42\xEC\x6E\x68\x20\x6C\x75\u1EAD\x6E\x3A\x20","\x3C\x2F\x73\x70\x61\x6E\x3E","\x3C\x2F\x64\x69\x76\x3E\x3C\x2F\x6C\x69\x3E","\x3C\x2F\x75\x6C\x3E","\x69\x6E\x6E\x65\x72\x48\x54\x4D\x4C","\x63\x74\x5F\x69\x64"];var cm_config_defaults={home_page:_0x826a[0],max_result:7,t_w:32,t_h:32,summary:9999,new_tab_link:true,ct_id:_0x826a[1],new_cm:_0x826a[2],interval:30000,alert:true},_cookie={set:function (_0x7e58x5,_0x7e58x6,_0x7e58x7){var i,_0x7e58x9;if(_0x7e58x7){i= new Date();i[_0x826a[4]](i[_0x826a[3]]()+(_0x7e58x7*24*60*60*1000));_0x7e58x9=_0x826a[5]+i[_0x826a[6]]();} else {_0x7e58x9=_0x826a[7];} ;document[_0x826a[8]]=_0x7e58x5+_0x826a[9]+_0x7e58x6+_0x7e58x9+_0x826a[10];} ,get:function (_0x7e58x6){var _0x7e58xa=_0x7e58x6+_0x826a[9],_0x7e58x9=document[_0x826a[8]][_0x826a[12]](_0x826a[11]),_0x7e58x7;for(var _0x7e58x5=0;_0x7e58x5<_0x7e58x9[_0x826a[13]];_0x7e58x5++){_0x7e58x7=_0x7e58x9[_0x7e58x5];while(_0x7e58x7[_0x826a[15]](0)==_0x826a[16]){_0x7e58x7=_0x7e58x7[_0x826a[14]](1,_0x7e58x7[_0x826a[13]]);} ;if(_0x7e58x7[_0x826a[17]](_0x7e58xa)==0){return _0x7e58x7[_0x826a[14]](_0x7e58xa[_0x826a[13]],_0x7e58x7[_0x826a[13]]);} ;} ;return null;} ,del:function (_0x7e58xb){this[_0x826a[18]](_0x7e58xb,_0x826a[7],-1);} },tt_cm=(_cookie[_0x826a[20]](_0x826a[19]))?_cookie[_0x826a[20]](_0x826a[19]):0,doc_title=document[_0x826a[21]];for(var i in cm_config_defaults){cm_config_defaults[i]=( typeof (cm_config[i])==_0x826a[22])?cm_config_defaults[i]:cm_config[i];} ;function showRecentComments(_0x7e58x12){var _0x7e58x13=_0x7e58x12[_0x826a[42]][_0x826a[41]],_0x7e58x14=parseInt(_0x7e58x12[_0x826a[42]][_0x826a[43]].$t,10),_0x7e58x15=_0x826a[7],_0x7e58x16=tt_cm,_0x7e58xe=cm_config_defaults;if(_0x7e58x16<_0x7e58x14){if(_0x7e58xe[_0x826a[44]]===true){alert((_0x7e58x14-_0x7e58x16)+_0x7e58xe[_0x826a[45]]);} else {if(_0x7e58xe[_0x826a[44]]===false){document[_0x826a[21]]=_0x826a[46]+(_0x7e58x14-_0x7e58x16)+_0x7e58xe[_0x826a[45]]+_0x826a[47]+doc_title;} else {_0x7e58xe[_0x826a[44]]((_0x7e58x14-_0x7e58x16),_0x7e58xe[_0x826a[45]]);} ;} ;} ;_0x7e58x15=_0x826a[48];for(var i=0;i<_0x7e58x13[_0x826a[13]];i++){for(var _0x7e58x7=0;_0x7e58x7<_0x7e58x13[i][_0x826a[49]][_0x826a[13]];_0x7e58x7++){if(_0x7e58x13[i][_0x826a[49]][_0x7e58x7][_0x826a[50]]==_0x826a[51]){link=_0x7e58x13[i][_0x826a[49]][_0x7e58x7][_0x826a[52]];break ;} ;} ;var _0x7e58x17=link[_0x826a[54]](_0x826a[53])+1,_0x7e58x18=link[_0x826a[54]](_0x826a[55]),_0x7e58x19=link[_0x826a[12]](_0x826a[57])[_0x826a[56]](_0x826a[16])[_0x826a[14]](_0x7e58x17,_0x7e58x18)+_0x826a[58];author=_0x7e58x13[i][_0x826a[59]][0];name=author[_0x826a[61]][_0x826a[60]];avatar=author[_0x826a[67]][_0x826a[31]][_0x826a[63]](/\/s[0-9]+(\-c|\/)/,_0x826a[64]+_0x7e58xe[_0x826a[65]]+_0x826a[66])[_0x826a[63]](/http\:\/\/www.google.com\/url\?source\=imglanding(.*?)q\=/i,_0x826a[7])[_0x826a[63]](/\.(jpg|jpeg|png|bmp|gif)(.*?)$/i,_0x826a[62]);profile=(author[_0x826a[68]])?author[_0x826a[68]][_0x826a[60]]:_0x826a[69];date=_0x7e58x13[i][_0x826a[71]][1][_0x826a[70]];content=(_0x826a[72] in _0x7e58x13[i])?_0x7e58x13[i][_0x826a[72]][_0x826a[60]][_0x826a[63]](/<br ?\/?>/ig,_0x826a[16])[_0x826a[63]](/<.*?>/g,_0x826a[7])[_0x826a[63]](/[<>]/g,_0x826a[7]):_0x826a[7];nt=(_0x7e58xe[_0x826a[73]])?_0x826a[74]:_0x826a[7];content=(content[_0x826a[13]]>_0x7e58xe[_0x826a[75]])?content[_0x826a[14]](0,_0x7e58xe[_0x826a[75]])+_0x826a[58]:content;_0x7e58x15+=_0x826a[76];_0x7e58x15+=_0x826a[77]+profile+_0x826a[78]+name+_0x826a[79]+nt+_0x826a[80]+name+_0x826a[81]+date+_0x826a[82]+link+_0x826a[78]+_0x7e58x19+_0x826a[79]+nt+_0x826a[80]+_0x7e58x19+_0x826a[83];_0x7e58x15+=_0x826a[84]+profile+_0x826a[78]+name+_0x826a[79]+nt+_0x826a[85]+_0x7e58xe[_0x826a[65]]+_0x826a[86]+_0x7e58xe[_0x826a[87]]+_0x826a[88]+avatar+_0x826a[89];_0x7e58x15+=_0x826a[90]+content+_0x826a[91];_0x7e58x15+=_0x826a[92];} ;_0x7e58x15+=_0x826a[93];document[_0x826a[37]](_0x7e58xe[_0x826a[95]])[_0x826a[94]]=_0x7e58x15;_cookie[_0x826a[18]](_0x826a[19],_0x7e58x14,7000);tt_cm=_0x7e58x14;} (function (){var _0x7e58xc=document[_0x826a[24]](_0x826a[23])[0],_0x7e58xd=document[_0x826a[26]](_0x826a[25]),_0x7e58xe=cm_config_defaults;_0x7e58xd[_0x826a[27]]=_0x826a[28];_0x7e58xd[_0x826a[29]]=_0x826a[30];_0x7e58xd[_0x826a[31]]=_0x7e58xe[_0x826a[32]]+_0x826a[33]+_0x7e58xe[_0x826a[34]]+_0x826a[35];_0x7e58xc[_0x826a[36]](_0x7e58xd);setInterval(function (){var _0x7e58xf=document[_0x826a[26]](_0x826a[25]);_0x7e58xf[_0x826a[27]]=_0x826a[28];_0x7e58xf[_0x826a[29]]=_0x826a[30];_0x7e58xf[_0x826a[31]]=_0x7e58xe[_0x826a[32]]+_0x826a[33]+_0x7e58xe[_0x826a[34]]+_0x826a[35];var _0x7e58x10=document[_0x826a[37]](_0x826a[30]);_0x7e58x10[_0x826a[39]][_0x826a[38]](_0x7e58x10);_0x7e58xc[_0x826a[36]](_0x7e58xf);} ,_0x7e58xe[_0x826a[40]]);} )(); </script>

Đối với đoạn mã này các bạn có thể chèn vào website bằng hai cách

Cách 1: Chèn vào sau thẻ <head> trong Mẫu - Tùy chỉnh HTML

Tìm đến thẻ <head> và chèn đoạn mã ngay sau thẻ đó

Cách 2: thêm một tiện ích mới HTML/Javascript,chèn đoạn mã đó vào và lưu lại

2: Hiển thị widget ra blog (website)

- Các bạn thêm tiện ích mới bằng cách vào phần Bố cục - Thêm tiện ích mới - HTML/JAVASCRIPT

- Dán đoạn mã sau vào nhớ thay link http://thuclexuan.blogspot.com thành link blog của các bạn vào nhé và  nhớ lưu lại.

<br /> <br /> <div id="comments-container"> Loading…</div> <script> var cm_config = { home_page: "http://thuclexuan.blogspot.com", max_result: 50, t_w: 32, t_h: 32, summary: 9999, new_tab_link: true, ct_id: "comments-container", new_cm: "Nhận xét mới!", interval: 30000, alert: true }; </script> <style scoped="scoped"> #comments { display: none; } DIV.cm-content{background:rgba(253, 249, 236, 0.99);color:#000;padding:5px} .thongtintg {width:100px;height:40px;loat:left} .noidungcm{width:400px;height:40px;loat:left} .tentacgia{background:#FAF8CC;padding:3px} .tentacgia a{color:#C11B17} .tentacbaiviet a{color:#3BB9FF} .cm-outer { margin:0 auto; padding:0; font:normal normal 11px/normal Arial,Sans-Serif; border-top:none; background:#fafafa; } .cm-text { font-size: 13px; } .cm-outer li { margin:0; padding:7px 10px 12px; list-style:none; clear:both; border-top:1px solid #fafafa; } .cm-outer .cm-header {margin:0 0 5px;background:#f4f4f4;color:#444;padding:5px} .cm-outer .cm-content {overflow:hidden} .cm-outer img { display:block; float:right; margin:2px 10px 2px 0; border:1px solid black; background:#8fa2cb url('http://img1.blogblog.com/img/anon36.png') no-repeat 50% 50%; overflow:hidden; } </style>

Vậy là chỉ cần chưa đến 5 phút với vài thao tác đơn giản các bạn đã có một tiện ích rất thú vị trên blog của mình rồi các bạn có thể tùy chỉnh thêm css để có thêm nhiều phong cách khác nhau cho phù hợp với blog của các bạn nhé

Nếu hay đừng quên chia sẻ ngay đến mọi người nhé.

Cảm ơn các bạn đã đọc bài viết trên blog của mình.