Recent Comment có thông báo số lượng comment mới của Blogspot

Tiện ích này cũng là tiện ích nhận xét gần đây mà bạn thường thấy trên các blogspot,chỉ khác một chút là tiện ích này có khả năng thông báo cho quản trị viên có bao nhiêu nhận xét mới trên blog.

Điểm đặc biệt của tiện ích này là khi bạn đang làm bất cứ việc gì trên blog của bạn mà có 1 nhận xét mới tiện ích sẽ có tab dạng popup thông báo cho bạn biết.

Các bạn có thể xem demo,trong phần demo thông báo hiển thị có 7 nhận xét đã cũ nhưng khi có nhận xét mới tiện ích sẽ cập nhật ngay.Xin lưu ý nếu truy cập trang đó lần thứ 2 nếu chưa có nhận xét mới thì sẽ không có thông báo.Muốn xem lại thì cần xóa cache hoặc đổi trình duyệt.
Xem thử:
DEMO

Để cài đặt tiện ích Recent Comment có thông báo số lượng comment mới của Blogspot đầu tiên ta thêm một tiện ích HTML/Javascript sau đó tùy chỉnh cho phù hợp với yêu cầu sở thích.
CODE

<style type="text/css" scoped="scoped">
.cm-outer {
margin:0 auto;
padding:0 0;
font:normal normal 11px Arial,Sans-Serif;
border:1px solid;
border-top:none;
}
.cm-outer li {
margin:0 0;
padding:7px 10px 12px;
list-style:none;
clear:both;
border-top:1px solid;
}
.cm-outer .cm-header {margin:0 0 5px}
.cm-outer .cm-content {overflow:hidden}
.cm-outer img {
display:block;
float:left;
margin:2px 10px 2px 0;
border:2px solid black;
background:#8fa2cb url('http://img1.blogblog.com/img/anon36.png') no-repeat 50% 50%;
overflow:hidden;
}
</style>
<div id="comments-container">Loading&hellip;</div>
<script type="text/javascript">
var cm_config = {
home_page: "http://kartriderdautocrazy01.blogspot.com",
max_result: 7,//Số lượng nhận xét được hiển thị
t_w: 32,//Chiều rộng avata
t_h: 32,//Chiều cao avata
summary: 9999,//Số lượng ký tự nhận xét
new_tab_link: true,
ct_id: "comments-container",
new_cm: " Nhận xét mới!",
interval: 30000,
alert: true
};
</script>
<script type='text/javascript'>
//<![CDATA[
var cm_config_defaults = {
home_page: "http://kartriderdautocrazy01.blogspot.com",
max_result: 7,
t_w: 32,
t_h: 32,
summary: 9999,
new_tab_link: true,
ct_id: "comments-container",
new_cm: " Komentar Baru!",
interval: 30000,
alert: true
}, _cookie = {
set: function (g, f, j) {
var i, h;
if (j) {
i = new Date();
i.setTime(i.getTime() + (j * 24 * 60 * 60 * 1000));
h = "; expires=" + i.toGMTString();
} else {
h = "";
}
document.cookie = g + "=" + f + h + "; path=/";
},
get: function (f) {
var e = f + "=",
h = document.cookie.split(";"),
j;
for (var g = 0; g < h.length; g++) {
j = h[g];
while (j.charAt(0) == " ") {
j = j.substring(1, j.length);
}
if (j.indexOf(e) == 0) {
return j.substring(e.length, j.length);
}
}
return null;
},
del: function (b) {
this.set(b, "", - 1);
}
}, tt_cm = (_cookie.get('tt_cm')) ? _cookie.get('tt_cm') : 0;
for (var i in cm_config_defaults) {
cm_config_defaults[i] = (typeof (cm_config[i]) !== undefined && typeof (cm_config[i]) !== 'undefined') ? cm_config[i] : cm_config_defaults[i];
}
function showRecentComments(json) {
var entry = json.feed.entry,
total = parseInt(json.feed.openSearch$totalResults.$t, 10), // Get the comments total
skeleton = "",
oldCount = tt_cm, // Get the older comments total
co = cm_config_defaults;
// Compare the older comments total with the new comments total.
// If it's greater, then => show the warning of `the new comments total` minus `the older comments total`
if (oldCount < total) {
if (co.alert === true) {
alert((total - oldCount) + co.new_cm);
} else if (co.alert === false) {
document.title = '(' + (total - oldCount) + co.new_cm + ') ' + document.title;
} else {
co.alert((total - oldCount), co.new_cm);
}
}
// Just a recent comments widget
skeleton = '<ul class="cm-outer">';
for (var i = 0; i < entry.length; i++) {
for (var j = 0; j < entry[i].link.length; j++) {
if (entry[i].link[j].rel == 'alternate') {
link = entry[i].link[j].href;
break;
}
}
var dash = link.lastIndexOf('/') + 1,
dot = link.lastIndexOf('.'),
title = link.split('-').join(" ").substring(dash, dot) + '&hellip;';
author = entry[i].author[0],
name = author.name.$t,
avatar = author.gd$image.src.replace(/\/s[0-9]+(\-c|\/)/, "/s" + co.t_w + "$1").replace(/http\:\/\/www.google.com\/url\?source\=imglanding(.*?)q\=/i, "").replace(/\.(jpg|jpeg|png|bmp|gif)(.*?)$/i, ".$1"),
profile = (author.uri) ? author.uri.$t : "#nope",
date = entry[i].gd$extendedProperty[1].value,
content = ("content" in entry[i]) ? entry[i].content.$t.replace(/<(.*?)>/g, "") : "",
nt = (co.new_tab_link) ? ' target="_blank"' : '';
content = (content.length > co.summary) ? content.substring(0, co.summary) + '&hellip;' : content;
skeleton += '<li>';
skeleton += '<div class="cm-header"><strong><a href="' + link + '" title="' + title + '"' + nt + '>' + name + '</a>, ' + date + '</strong></div>';
skeleton += '<div class="cm-content"><a href="' + profile + '" title="' + name + '"' + nt + '><img alt="Loading..." style="width:' + co.t_w + 'px;height:' + co.t_h + 'px;" src="' + avatar + '"></a>';
skeleton += '<span class="cm-text">' + content + '</span>';
skeleton += '</div></li>';
}
skeleton += '</ul>';
document.getElementById(co.ct_id).innerHTML = skeleton;
_cookie.set('tt_cm', total, 7000);
tt_cm = total;
console.log(tt_cm);
}
(function () {
var head = document.getElementsByTagName('head')[0],
script = document.createElement('script'),
co = cm_config_defaults;
script.type = "text/javascript";
script.id = "cm-feed-script";
script.src = co.home_page + "/feeds/comments/default?alt=json-in-script&redirect=false&max-results=" + co.max_result + "&callback=showRecentComments";
head.appendChild(script);
setInterval(function () {
var newScript = document.createElement('script');
newScript.type = "text/javascript";
newScript.id = "cm-feed-script";
newScript.src = co.home_page + "/feeds/comments/default?alt=json-in-script&redirect=false&max-results=" + co.max_result + "&callback=showRecentComments";
var oldScript = document.getElementById('cm-feed-script');
oldScript.parentNode.removeChild(oldScript);
head.appendChild(newScript);
}, co.interval);
})();
//]]>
</script>

Thay http://kartriderdautocrazy01.blogspot.com thành URL Blog của bạn
Một số tùy chọn
Có một vài điều bạn nên biết về cấu hình nâng cao của tiện ích này:

Tùy chọn	Thông tin
home_page	Thay đổi giá trị URL của trang chủ blog của bạn
max_result	Được sử dụng để xác định số lượng ý kiến ​​mà sẽ được hiển thị trên widget
t_w	Được sử dụng để xác định chiều rộng của avatar
t_h	Được sử dụng để xác định chiều cao của avatar
summary	Được sử dụng để xác định số lượng ký tự hiển thị của bình luận(9999 là hiển thị toàn bộ)
new_tab_link	Nếu giá trị đúng(true), toàn bộ liên kết là trong các phụ tùng này sẽ mở ra một tab / cửa sổ mới khi nhấn vào
tt_id	ID chứa tổng ý kiến ​​(bỏ qua nếu không cần thiết)
ct_id	Danh sách container ID ý kiến ​​(bỏ qua nếu không cần thiết)
new_cm	Nhãn văn bản sẽ xuất hiện sau khi số lượng bình luận (ví dụ: 2 Các ý kiến ​​mới!)
interval	Thời gian làm mới dữ liệu(3000 là sau 1/2 phút)
alert	Kiểu thông báo

Chúc thành công!
Nguồn: dte.web.id