Đếm lượt xem bài viết bằng cookie

Thông thường bộ đếm lượt truy cập bài viết được đặt ở cuối bài viết, do đó bạn có thể tìm trong Template ở chế độ mở rộng mẫu tiện ích đến một trong những dòng code sau:

<div class='post-footer'>

<div class='post-footer-line post-footer-line-1'>

<div class='post-footer-line post-footer-line-2'>

<div class='post-footer-line post-footer-line-3'>

Rồi đặt trước hoặc sau nó bằng đoạn code bên dưới:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
function setC(visitors, value){
var expireDate=new Date (2099, 12, 31);
document.cookie = visitors + "=" + escape(value) + ((expireDate == null) ? "" : ("; expires=" +
expireDate.toGMTString())) }
function readC(visitors){
var search = visitors + "=";
var i, j;
if (document.cookie.length > 0) {
i = document.cookie.indexOf(search);
if (i != -1) {
i += search.length;
j = document.cookie.indexOf(";", i);
if (j == -1) j = document.cookie.length;
return unescape(document.cookie.substring(i,j));
} } }
var num;
num=readC("visitors");
if (!num) num=0;
num++;
setC("visitors", num);
document.write("<div class='visitors'>");
document.write("<b>Bạn đã xem bài này "+num+" lần.<\/b>");
document.write("<\/div>");
//]]>
</script>
</b:if>

Nếu muốn tùy biến CSS cho dòng thông báo thì bạn đặt CSS như thế này (trước dòng ]]></b:skin> trong Template):

.visitors{

… đặt các thuộc tính CSS ở đây nha ..

}

Hy vọng đoạn script này sẽ giúp ích cho blogspot của bạn, tránh đến việc sử dụng host để dành cho cả một thủ thuật nhỏ như thế này quả thật là bất tiện và phung phí."; /* */

Đếm lượt xem bài viết là một thủ thuật khá cần thiết cho blogspot. Thông thường việc đếm lượt xem bài viết được thực hiện bằng ngôn ngữ php tuy nhiên nó yêu cầu sử dụng host, do đó dẫn đến việc đứt gánh giữa đường khi host không còn hoạt động. Ở đây mình hướng dẫn bạn cách đếm lượt xem bài viết sử dụng cookie. Bạn có thể xem DEMO bên dưới.


Thông thường bộ đếm lượt truy cập bài viết được đặt ở cuối bài viết, do đó bạn có thể tìm trong Template ở chế độ mở rộng mẫu tiện ích đến một trong những dòng code sau:

<div class='post-footer'>

<div class='post-footer-line post-footer-line-1'>

<div class='post-footer-line post-footer-line-2'>

<div class='post-footer-line post-footer-line-3'>

Rồi đặt trước hoặc sau nó bằng đoạn code bên dưới:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
function setC(visitors, value){
var expireDate=new Date (2099, 12, 31);
document.cookie = visitors + "=" + escape(value) + ((expireDate == null) ? "" : ("; expires=" +
expireDate.toGMTString())) }
function readC(visitors){
var search = visitors + "=";
var i, j;
if (document.cookie.length > 0) {
i = document.cookie.indexOf(search);
if (i != -1) {
i += search.length;
j = document.cookie.indexOf(";", i);
if (j == -1) j = document.cookie.length;
return unescape(document.cookie.substring(i,j));
} } }
var num;
num=readC("visitors");
if (!num) num=0;
num++;
setC("visitors", num);
document.write("<div class='visitors'>");
document.write("<b>Bạn đã xem bài này "+num+" lần.<\/b>");
document.write("<\/div>");
//]]>
</script>
</b:if>

Nếu muốn tùy biến CSS cho dòng thông báo thì bạn đặt CSS như thế này (trước dòng ]]></b:skin> trong Template):

.visitors{

… đặt các thuộc tính CSS ở đây nha ..

}

Hy vọng đoạn script này sẽ giúp ích cho blogspot của bạn, tránh đến việc sử dụng host để dành cho cả một thủ thuật nhỏ như thế này quả thật là bất tiện và phung phí.

Xin chào các bạn ghé thăm trang Trần Phúc Minh, mong các bạn có nhận xét góp ý cho trang này