Thống kê lượt truy cập cho blogspot

Demo

Chào các bạn!

Thống kê lượt truy cập cho blogspot là tiện ích mà có lẽ rất ít blogger áp dụng vào blog của mình bởi nó quá xấu và nếu không tùy biến thêm thì cũng chẳng muốn áp dụng vào blog làm gì cả.

So với blogger thì bên Wordpress lại có các tiện ích rất tốt và tiện lợi gắn thêm về việc đếm lượt truy cập blog, lượt xem...

Tại sao nên chèn tiện ích đếm lượt truy cập?

Cái này khá quan trọng, lý do chính nhất là giúp các blogger quản lý lượng truy cập, số bài đăng và các comment trên blog, lý do ít quan trọng thứ hai là nó giúp blog trông chuyên nghiệp và đẹp hơn.

Chèn tiện ích như thế nào?

Trên mạng có rất nhiều cách chèn tiện ích đếm lượt xem cho blogspot, hôm nay hướng dẫn các bạn chèn một tiện ích lượt đếm khá đẹp, có cả mục view page, số bài đăng và lượt comment, tiếc là không có "Đang Online".

Cách thực hiện.

Bước 1: Đăng nhập blogger
Bước 2: Chọn "Bố cục" rồi "Thêm tiện ích"
Bước 3: Chọn "Thống kê blog".

Thống kê blog

Bước 4: Chọn Mẫu, chọn chỉnh sửa Mẫu ở chế độ HTML

Chỉnh sửa Mẫu ở chế độ HTML

Bước 5: Coppy đoạn mã sau rồi dán nó vào sau thẻ

<span expr:class='&quot;counter-wrapper &quot; + (data:showGraphicalCounter ? &quot;graph-counter-wrapper&quot; : &quot;text-counter-wrapper&quot;)' expr:id='data:widget.instanceId + &quot;_totalCount&quot;'>
      </span>

Nếu không tìm được đoạn thẻ trên thì các bạn tìm "Stats1" rồi dán đoạn code dưới vào trong nội dung của thẻ "Stats1".

<script type="text/javascript">
   function postCount(json){
    document.write("<span class='counts post2'> Tổng số bài viết ");
    var count = json.feed.openSearch$totalResults.$t;
    document.write("<span class='count'>" + count + "</span>");
    document.write("</span>")
  }
  function numberOfComments(json){
    document.write("<span class='counts comment'> Tổng lượt Comments ");
    var count = json.feed.openSearch$totalResults.$t;
    document.write("<span class='count'>" + count + "</span>");
    document.write("</span>")
   }
 </script>
<script src="/feeds/posts/default?alt=json-in-script&amp;max-results=0&amp;callback=postCount" type="text/javascript"></script>
<script src="/feeds/comments/default?alt=json-in-script&amp;max-results=0&amp;callback=numberOfComments"></script>

Bước 5: Coppy đoạn code sau rồi dán nó lên trước thẻ đóng </head>

<style type='text/css'> /* Blogger Custom Stats widget*/ .Stats img {display:none!important;background-image:none;} .Stats .counter-wrapper {width:92%;text-align:right;margin:10px;line-height:35px;color:#ff5722;font-weight:700;font-size:16px;margin-left: 0;} .Stats .counter-wrapper:after {content:&quot;Page View &quot;;float:left;text-align:left;font-size:16px;font-weight:700;color:#212121;} .counts {display:inline-block;width:92%;font-size:16px;line-height:35px;color:#212121;font-weight:700;} .counts .count {display:inline-block;font-size:16px;height:30px; vertical-align:top;direction:ltr;float:right;color:#ff5722;font-weight:700!important;} .counts:hover .titles:before {color:#333!important;border-radius:2px;border-color:rgba(255,255,255,0.1);} .counter-wrapper.text-counter-wrapper:before, .counts:before {display:inline-block;font-size:13px;font-family:FontAwesome;font-style:normal;font-weight:normal;margin:0 10px 0 10px;float:left;width:10px;text-align:center;} .counter-wrapper.text-counter-wrapper:before, .counts:before { display:block;background-color:#fff;color:#28AE5F;width:35px;height:35px;font-size:18px;line-height:35px;border-radius:2px;margin:0px 8px 0 0;} .counter-wrapper.text-counter-wrapper:before {content:&quot;\f06e&quot;;} .counts.post2:before {content:&quot;\f044&quot;;} .counts.comment:before {content:&quot;\f0e6&quot;;} #Stats1_content {width:auto;height:auto;background-color:#fff;} </style>

Bước 6: Lưu mẫu và kiểm tra kết quả. Chúc các bạn thành công.