Tiện ích Top Commentators cho phép hiển thị những đọc giả có lượng comment nhiều nhất. Hiện tại có 1 số blog đã có tiện ích này nhưng họ đã mã hóa code và không chia sẻ, đối với 1 số bạn không rành về javacript sẽ không đọc được các đoạn mã này. Hôm nay nhân tiện có người hỏi về thủ thuật này nên mình cũng xin chia sẻ để mọi người dùng.
Một vài thông tin của tiện ích :
- Không đếm comment của khách nặc danh.
- Chỉ thống kê được tối đa trong 200 comment mới nhất.
- Hiện thị ảnh đại diện (tất cả các author ngoại trừ nặc danh).
- Hiện thị số comment của từng người.
Xem DEMO
Hình ảnh minh họa
Để thực hiện các bạn chỉ việc tạo 1 widget HTML/javascript ở nơi muốn hiển thị rồi dán đoạn code bên dưới vào là được:
<style type="text/css">
.top-author ul li {
list-style:none;
width:250px;
height:45px!important;
border-bottom:1px solid #ccc;
margin-top:5px;
display:block!important;
}
.tau-cont {margin-left:38px;}
.tau-cont h4 {margin:0;padding:0;}
.tau-cont span {color:#555;}
img.tau-thumb {
float: left;
margin-right: 10px;
border: 1px solid #CCC;
padding: 0;
width: 36px;
height: 36px;
}
</style>
<script type="text/javascript">
var no_photo='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDkHZ1-u9MducaZEguZpZCZp_Gcd18rz9gKywltlLOL5Z_9nIYuZl2oWOe4ncv8OhyphenhyphenQzgvYP1glXM14LeemeHRvziEDalpc0Syeud75Qbw53KvV4GHujl4Y7vKnZWgAR5sl89NrIR7W07J/s50/blogger-nophoto.png';
var another_au='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhrgz7Q-U99rBxtVjucp9WdLEwSNZCGnfgHYhDeXJhELc_2FlmKxMzvPG-z5ZTQ7ByFpwQN2J2X1dcLEzpljOhXZJWtkhEJNUq70CDzI0NpsivKSq1UR3ivIKDchLWCYUjQrHaVCFW9R-Q/s23/another-ico.png';
var au_nums=5;
var rcm_nums=100;
var homepage="http://www.fandung.com";
</script>
<div class="top-author">
<script type="text/javascript" src="http://fandung.googlecode.com/svn/trunk/js/top-author.js"></script>
</div>
Một vài lưu ý :.top-author ul li {
list-style:none;
width:250px;
height:45px!important;
border-bottom:1px solid #ccc;
margin-top:5px;
display:block!important;
}
.tau-cont {margin-left:38px;}
.tau-cont h4 {margin:0;padding:0;}
.tau-cont span {color:#555;}
img.tau-thumb {
float: left;
margin-right: 10px;
border: 1px solid #CCC;
padding: 0;
width: 36px;
height: 36px;
}
</style>
<script type="text/javascript">
var no_photo='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDkHZ1-u9MducaZEguZpZCZp_Gcd18rz9gKywltlLOL5Z_9nIYuZl2oWOe4ncv8OhyphenhyphenQzgvYP1glXM14LeemeHRvziEDalpc0Syeud75Qbw53KvV4GHujl4Y7vKnZWgAR5sl89NrIR7W07J/s50/blogger-nophoto.png';
var another_au='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhrgz7Q-U99rBxtVjucp9WdLEwSNZCGnfgHYhDeXJhELc_2FlmKxMzvPG-z5ZTQ7ByFpwQN2J2X1dcLEzpljOhXZJWtkhEJNUq70CDzI0NpsivKSq1UR3ivIKDchLWCYUjQrHaVCFW9R-Q/s23/another-ico.png';
var au_nums=5;
var rcm_nums=100;
var homepage="http://www.fandung.com";
</script>
<div class="top-author">
<script type="text/javascript" src="http://fandung.googlecode.com/svn/trunk/js/top-author.js"></script>
</div>
- var no_photo : avatar của tài khoản blogger chưa có ảnh đại diện.
- var another_au : avatar của tài khoản khác blogger.
- var au_nums=5; số tác giả được hiển thị
- var rcm_nums=100; số comment sẽ được khoanh vùng để thống kê (phải nhỏ hơn hoặc bẳng 200)
- var homepage="http://www.fandung.com"; thay http://www.fandung.com bằng tên miền của blog bạn.
Chúc các bạn thành công.
Thực hiện theo yêu cầu của Trần Việt Đức