Tạo Thống Kê Blog đếm số lượng Posts,Comments,Pageviews ~ Ngoc Anh

Hôm nay mình giới thiệu tới các bạn là cách thêm thống kê cho blogspot. Theo mặc định tiện ích thống kê của blog thì chỉ xem được thống kê l...

Blogspot+ Thu-thuat-blog

Hôm nay mình giới thiệu tới các bạn là cách thêm thống kê cho blogspot. Theo mặc định tiện ích thống kê của blog thì chỉ xem được thống kê lượt xem trang thôi. Tuy nhiên khi làm theo thủ thuật này thì bạn có thể thêm những thống kê đẹp như Tổng bài viết, tổng lượt comment.

Tạo Thống Kê Blog đếm số lượng Posts,Comments,Pageviews cho blogpost

Đây là phiên bản nâng cấp cho tiện ích Thống kê blog có sẵn của Blogger. Ngoài số lượt truy cập blog thì mình có thêm thống kê tổng số bài viết và tổng số nhận xét cho tiện ích này. Và dữ liệu cho 2 thống kê này được lấy từ feed với dung lượng nhỏ nhất. Vì sử dụng đến dữ liệu từ feed nên blog bạn áp dụng phải ở chế độ mở cho tất cả người đọc.

Thống Kê Blog V1

Bước 1: Blog => Bố cục => Thêm tiện ích => Tiện ích khác => Thống Kê Blog => Lưu lại
Bước 2: Tới Mẫu => Chỉnh sửa HTML => Nhấn tổ hợp Ctrl + F và tìm kiếm ]]></b:skin> và chèn đoạn mã CSS sau đây ở trên ]]></b:skin>. Sau đó Lưu lại.

/* Thống kê blog */
# Stats1 ul {margin: 0px 0; border: 0; padding: 0}
# Stats1 7px; text-decoration: none; text-shadow: none; margin: 0 1px 1px 0; font-size: 12px; list-style-type: none}
# Stats1 h4 {margin: 0; font-size: 18px; line-height: 1.2em; color: # fff; text-shadow: none}
# Stats1 khoảng {font-size: 12px; color: # fff; text-shadow: none}
#totalComments {background-position: 0 -68px}
#totalCount {background-position: -136px 0}
} /* END Thống kê blog */

Bước 3: Vào Chỉnh sửa HTML (không chọn Mở rộng Mẫu Tiện ích) và tìm trong template từ khóa

<b:widget id='Stats1' locked='false' title='Tổng số lượt xem trang' type='Stats'/>

Hoặc các bạn có thể làm theo cách sau cho nhanh : Blog => Mẫu => Chuyển đến tiện ích => Stats1 => tìm đến đoạn mã

<b:widget id='Stats1' locked='false' title='Thống Kê Blog' type='Stats'>...</b:widget>

Thay thế nó bằng đoạn mã dưới đây.

<b:widget id='Stats1' locked='false' title='Thống Kê Blog' type='Stats'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul>
<li>
<h4 id='Stats1_totalPosts'>&hellip;</h4>
<span>Posts</span>
</li>
<li id='totalComments'>
<h4 id='Stats1_totalComments'>&hellip;</h4>
<span>Comments</span>
</li>
<li id='totalCount'>
<h4 expr:id='data:widget.instanceId + "_totalCount"'>&hellip;</h4>
<span>Pageviews</span>
</li>
</ul>
<script type='text/javascript'>
//<![CDATA[
function totalPosts(json){document.getElementById('Stats1_totalPosts').innerHTML=json.feed.openSearch$totalResults.$t};function totalComments(json){document.getElementById('Stats1_totalComments').innerHTML=json.feed.openSearch$totalResults.$t};document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalPosts\"><\/script><script type=\"text/javascript\" src=\"/feeds/comments/default?alt=json-in-script&max-results=0&callback=totalComments\"><\/script>');
//]]>
</script>
</div>
</b:includable>
</b:widget>

Thống Kê Blog V2

Các bạn cũng làm tương tự các bước như V1 nhé .

Bước 1: Blog => Bố cục => Thêm tiện ích => Tiện ích khác => Thống Kê Blog => Lưu lại
Bước 2: Tới Mẫu => Chỉnh sửa HTML => Nhấn tổ hợp Ctrl + F và tìm kiếm ]]></b:skin> và chèn đoạn mã CSS sau đây ở trên ]]></b:skin>. Sau đó Lưu lại.

#Stats1 ul{margin:10px 0;border:0;padding:0}
#Stats1 li{margin:0;border:0;background-color:#ff4e47;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDOmlk8iBfNXAX2dAAJAAGuQgPP73Ol23ijdEUbpVOSJjHvnVdtz1k4t5tOuNHp_0hZA9V2_ZqkBFDE8dpcb9VFi8bg3TWTdj487ri_DG4uwmN-fzxZWZeuxUXAQsG30w5yankSy8C0bE/s194/sprites-stats.png);background-repeat:no-repeat;padding:10px 10px 10px 80px;list-style-type:none}
#Stats1 h4{margin:0;font-size:22px;line-height:1.2em;color:#fff;text-shadow:none}
#Stats1 span{font-size:13px;color:#fff;text-shadow:none}
#totalComments{background-position:0 -68px}
#totalCount{background-position:0 -136px}

Bước 3: Vào Chỉnh sửa HTML (không chọn Mở rộng Mẫu Tiện ích) và tìm trong template từ khóa

<b:widget id='Stats1' locked='false' title='Tổng số lượt xem trang' type='Stats'/>

Hoặc các bạn có thể làm theo cách sau cho nhanh : Blog => Mẫu => Chuyển đến tiện ích => Stats1 => tìm đến đoạn mã

<b:widget id='Stats1' locked='false' title='Thống Kê Blog' type='Stats'>...</b:widget>

Thay thế nó bằng đoạn mã dưới đây.

<b:widget id='Stats1' locked='false' title='' type='Stats'>
<b:includable id='main'>
<div class='widget-content'>
<ul>
<li>
<h4 id='Stats1_totalPosts'>&hellip;</h4>
<span>Posts</span>
</li>
<li id='totalComments'>
<h4 id='Stats1_totalComments'>&hellip;</h4>
<span>Comments</span>
</li>
<li id='totalCount'>
<h4 expr:id='data:widget.instanceId + "_totalCount"'>&hellip;</h4>
<span>Pageviews</span>
</li>
</ul>
<script type='text/javascript'>
//<![CDATA[
function totalPosts(json){document.getElementById('Stats1_totalPosts').innerHTML=json.feed.openSearch$totalResults.$t};function totalComments(json){document.getElementById('Stats1_totalComments').innerHTML=json.feed.openSearch$totalResults.$t};document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalPosts\"><\/script><script type=\"text/javascript\" src=\"/feeds/comments/default?alt=json-in-script&max-results=0&callback=totalComments\"><\/script>');
//]]>
</script>
</div>
</b:includable>
</b:widget>

Sau đó Lưu lại và kiểm tra thành quả nhé.
Tùy phiên bản ngôn ngữ blog của bạn mà tiêu đề Tổng số lượt xem trang có thể khác nhau dẫn đến từ khóa tìm kiếm ở bước 3 cũng có sự khác biệt.Thủ thuuatj hay và tạo cho trang web/blog của bạn thêm phần chuyên nghiệp phait ko nào.
Chúc các bạn thành công