Tuesday, June 12, 2018

Đã là một Blogger thì chắc chắn bạn phải có riêng cho mình một blog và ít nhiều gì thì lượt xem hay comment cũng có phải không nào? Và không phải bạn có cái thống kê của bạn ở trang chủ quản trị mà bạn cần tạo cho website của mình một bảng thống kê riêng.
Và cũng do một số yêu cầu của các bạn bè của mình nên hôm nay mình sẽ share khung Thống kê blogspot cực chất. Và nó có rất nhiều điều hay ho các bạn cùng tham khảo nhé!
Tiện ích thống kê này được mình edit lại từ Tiện ích giới thiệu của anh Ngô Quang Trường (Truongblogger.com) và thêm vào đó một số tính năng nói chung là hay ho để cho nó được bá đạo và đẹp mặt hơn
Thôi vào bài luôn nha, dài dòng nãy giờ đủ rồi 😀

Đầu tiên để tạo 1 widget thì chúng ta phải truy cấp vào Blogger => Bố cục (layout) => Thêm Tiện ích => HTML/Javascript rồi paste các đoạn code bên dưới vào nhé

1. Thống Kê Ảo All


Đây  là một dạng thống kê khá hay và đáng để cho các bạn thử. Nó khá là đơn giản bởi vì mình chỉ sử dụng lại các đoạn code mà anh Trường đã cung cấp ngay trong widget.
Cái này phần lớn là dành cho các bạn sống ảo thôi nhé :v

Code:

<style>
#ketnoi{margin:0 0 -5px;width: 100%;box-sizing: border-box;display: inline-block;position: relative;color: #333;line-height: normal;text-align: center; border: 2px solid #eee;font-weight: 700;font-size:12px}
#ketnoi a{color:#333}
#ketnoi-col-1{width: 33.3333%;float: left;}
#ketnoi-col-1 span,#ketnoi-col-1 p{margin:0;padding:0}
.ketnoi-icon{display: block;width: 50px;height: 50px;line-height: 50; text-align: center;background: #333;color: #fff;margin: 0 auto 5px;border-radius: 100%;transition: .3s;font-size: 22px;}
.ketnoi-pageview,.ketnoi-post,.ketnoi-comments,.{padding: 10px 0;}
.ketnoi-pageview,.ketnoi-post,.ketnoi-comments{border-bottom: 1px solid #eee}
.ketnoi-pageview,.ketnoi-post,.ketnoi-comments{border-left: 1px solid #eee;border-right: 1px solid #eee;}
.ketnoi-pageview i{background: #39599f}
.ketnoi-post i{background:#9b59b6}
.ketnoi-comments i{background:#1abc9c}
</style>
<div id='ketnoi'>
<div id='ketnoi-col-1'>
<div class='ketnoi-pageview'>
<i class="fa fa-eye ketnoi-icon"></i>
<span>6.682.293</span><p>Lượt Xem</p></a>
</div>
</div>
<div id='ketnoi-col-1'>
<div class='ketnoi-post'>
<i class="fa fa-pencil-square-o ketnoi-icon"></i><span>51</span><p>Bài Viết</p></a>
</div>
</div>
<div id='ketnoi-col-1'>
<i class="fa fa-comments ketnoi-icon"></i><span>828/span><p>Bình luận</p></a>
</div>
</div></div>

Tùy theo ý thích mà các bạn chỉnh sửa các con số mà mình in đậm trong code nhé!

2.Thống Kê Nữa Ảo Nữa Thật

Ok, cái này cũng là một cái thống kê nhưng cái này nó cao cấp hơn, Tại sao?. Bởi vì khung thống kê này được mình nâng cấp lại các phần và chú ý rằng cái đoạn code này mình có dùng đến  JavaScript (js) nên có lẽ nó sẽ ảnh hưởng đến việc load trang blog bạn đấy nhé

Code:


<style>
#ketnoi{margin:0 0 -5px;width: 100%;box-sizing: border-box;display: inline-block;position: relative;color: #333;line-height: normal;text-align: center; border: 2px solid #eee;font-weight: 700;font-size:12px}
#ketnoi a{color:#333}
#ketnoi-col-1{width: 33.3333%;float: left;}
#ketnoi-col-1 span,#ketnoi-col-1 p{margin:0;padding:0}
.ketnoi-icon{display: block;width: 50px;height: 50px;line-height: 50px;text-align: center;background: #333;color: #fff;margin: 0 auto 5px;border-radius: 100%;transition: .3s;font-size: 22px;}
.ketnoi-facebook,.ketnoi-post,.ketnoi-comments,.{padding: 10px 0;}
.ketnoi-facebook,.ketnoi-post,.ketnoi-comments{border-bottom: 1px solid #eee}
.ketnoi-post,.ketnoi-lienhe{border-left: 1px solid #eee;border-right: 1px solid #eee;}
.ketnoi-facebook i{background: #39599f}
.ketnoi-post i{background:#9b59b6}
.ketnoi-comments i{background:#1abc9c}
</style>
<div id='ketnoi'>
<div id='ketnoi-col-1'>
<div class='ketnoi-facebook'>
<i class="fa fa-eye ketnoi-icon"></i> <a> <script type='text/javascript'>document.write(Math.floor((Math.random()*2738)+500000));</script></a>
<p>Lượt Xem</p>
</div>
</div>
<div id='ketnoi-col-1'>
<div class='ketnoi-post'>
<i class="fa fa-file-pencil-square-o ketnoi-icon"></i><span><script style="text/javascript">function showpostcount(t){document.write(parseInt(t.feed.openSearch$totalResults.$t,10))}</script><script src="/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script></span><p>Bài viết</p>
</div>
</div>
<div id='ketnoi-col-1'>
<div class='ketnoi-comments'>
<i class="fa fa-comments ketnoi-icon"></i><span><script style="text/javascript">function numberOfComments(e){document.write(e.feed.openSearch$totalResults.$t)}</script><script src="/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script></span><p>Bình luận</p>
</div>
</div></div>

Nói luôn cho các bạn khỏi tò mò rằng đoạn code này chỉ thống kê chính xác số lượng comments và số lượng post trên blog thôi nhé, còn số lượng view blog là random tự động đấy nhé.
Đừng có dại mà chụp màng hình số lượng views lại rồi đăng lên các trang mạng xã hội nhé, bị ném đá sml đó


3.Thống Kê Hoàn Hảo - Chuẩn All


Phần này là vì code có hạn nên mình sẽ  để trống nhé =). Nếu sau này mình tìm ra được đoạn code thống kê tổng lượt xem trang thì mình sẽ update.

Ok! Mình đã giúp các bạn tạo một thống kê cho Blog rồi đấy, bây giờ phần thực hành là của các bạn. Các bạn cũng có thể phối các đoạn code lại với nhau để tạo cho mình một thống kê riêng với style của các bạn.

Còn bây giờ thì mình xin chào các bạn nhé!
Chúc các bạn thành công nhé! Có gì không được thì cứ bình luận bên dưới mình sẽ giải đáp nhé. Cảm ơn các bạn!

Bài Trước Đó
Xem Thêm

Posted By:

48 comments:

  1. Replies
    1. Hehe cảm ơn Sinh nhen
      Like của Sinh nữa là được 1tr like rồi kìa :v

      Delete
  2. Pro đây ông hôm bữa có cái template hiển thị số lượt xem ảo trên bài viết bá quá mà ko biết nó dùng code gì :))

    ReplyDelete
    Replies
    1. Hehe bâyh có vui rồi đó nhé :)

      Delete
    2. Vui cái cù lôi mà vẫn thích thật dc như vậy hơn ,:))

      Delete
  3. Replies
    1. Ấy da dạo này temp toàn lỗi nên em toàn đi edit temp ko có time suy nghĩ viết bài luôn anh ơi :)

      Delete
    2. Font chữ trên điện thoại lỗi

      Delete
    3. Dạ thanks anh
      Giờ em mới để ý, cơ mà fix thế nào v anh :v

      Delete
    4. Đâu có đâu anh, vẫn temp smooth gird mà

      Delete
  4. :v quá là nhạt by huy đz

    ReplyDelete
    Replies
    1. Ok, cảm ơn bạn Huy ml :v đã góp ý, Phúc sẽ xem sét lại bài đăng :)

      Delete
  5. bài viết hay rảnh ghé blog mình nhé ad www.thaiquyit.tk

    ReplyDelete
    Replies
    1. Ok, nếu vậy thì mình làm cái liên kết đi chứ :)

      Delete
  6. Replies
    1. Ibx Sinh ới
      Chỉ tui cái, tui thấy bth mà

      Delete
  7. Replies
    1. ẹc, ổn gì ông
      đang edit lại cho giống temp toicode cũ lại mệt quá

      Delete
  8. Replies
    1. Cop đâu cha
      Phần lớn là của anh Trường tui edit lại thôi

      Delete
    2. ỪA, bài nhìn cũng khá chất lượng, chỉnh font lại đi ông

      Delete
    3. Hehe thanks nha, cơ mà bâyh thay thành font gì đây, ko ràh bên fts nên ko pik font j ổn nwqx

      Delete
  9. Thông kê đánh lừa thị giác ng xem là có thật phải ko e nhỉ? =)))

    ReplyDelete
    Replies
    1. Ahihi, cho m₫ sống ảo ấy mà anh
      Còn cái em đag sài là thật ngoại trừ cái page views :)

      Delete
  10. Cái template ông đang lỗi kìa

    ReplyDelete
    Replies
    1. Ơ, chỗ nào thế Quốc
      Mobile hay pc vậy

      Delete
    2. Template mới ổn đó ông

      Delete
    3. Ùhm, nhìn cx đc
      Nhưg ság thay temp chiều có biến lớn 😔😔

      Delete
  11. P êi, chúc e buổi tối mát mec nhá ^^

    ReplyDelete
    Replies
    1. Dạ ôky anh, mà ânh onl gì mà muộn thế em ngủ mất rồi :)

      Delete
  12. Replies
    1. Hehe, chỉ view là ảo còn 2 cái kia có thể thay code thành thật đc mà :))

      Delete
    2. Cơ mà blog ôg sao bảo trì thế Nhân

      Delete
  13. góp ý: view để ramdom vào cho nó nhảy nhìn chất hơn bác ơi
    Tên Hiển Thị: ADMIN | LÊ ANH ĐỨC ✅
    URL Chuyển Hướng: https://www.leanhduc.xyz/
    URL Gốc: https://adminducxamlone.blogspot.com (Nếu đặt lk thì bác đặt cái này nha)
    ĐÃ ĐẶT LIÊN KẾT CHO BÁC - HÓNG ĐẶT LẠI
    HỢP TÁC - PHÁT TRIỂN (NẾU ĐẶT LIÊN KẾT THÌ QUA CHƠI BÁO LẠI CHO EM MỘT TIẾNG NHA BÁC)

    ReplyDelete
    Replies
    1. Ố kê thanks bác đã góp ý nhưg mà views để rendom thì nó nhảy nhìn chất nhưg mà nhìn nó không được đẹp cho lắm :))
      Đã đặt lk cho bro, ttt nhé =]]

      Delete
Xem Hướng Dẫn Bình Luận