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

Recent Comment có thông báo số lượng comment mới của Blogger
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.
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.
Điểm đặc biệt của tiện ích này là khi bạn đang làm bất cứ việc trên blog của bạn mà có 1 nhận xét mới tiện ích sẽ có thông báo cho bạn biết.

Để cài đặt tiện ích này đầ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://www.dte.web.id",
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ọnThông tin
home_pageThay đổ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_linkNế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_idID chứa tổng ý kiến ​​(bỏ qua nếu không cần thiết)
ct_idDanh sách container ID ý kiến ​​(bỏ qua nếu không cần thiết)
new_cmNhã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!)
intervalThời gian làm mới dữ liệu(3000 là sau 1/2 phút)
alertKiểu thông báo
Chúc thành công!
Nguồn: dte.web.id
Nhận xét

Không có nhận xét nào :