Tiện ích Top Commentators cho blogspot
Thứ Sáu, 23 tháng 12, 2011
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/AVvXsEhhWW0l5Ae20WiEo6DrFoVP4PcBlyQSYt3u70ONTmWwYTJxVIeB4acilXcLkQ2-dJH0jweq2PEAhwQtdnFzk8viMTlOcNLij1XuyW2J0J24uNOBwc_yJGGQKfW1MaBT6c6hlTvYtdB41bMu/s50/blogger-nophoto.png';
var another_au='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEju5Wl8zsKFiYsF653csgceF_yd-gK1BfmgzZSQqmAXD4iPe7VxNoQ-lQ7ChHB8Bds3X0RTxXDNmI3_4thyphenhyphenwphLoz7EZvw32z3bxtzasuZedmuvApdWsIDbUT9dBSi8BfRk1zS54blnXdVW/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/AVvXsEhhWW0l5Ae20WiEo6DrFoVP4PcBlyQSYt3u70ONTmWwYTJxVIeB4acilXcLkQ2-dJH0jweq2PEAhwQtdnFzk8viMTlOcNLij1XuyW2J0J24uNOBwc_yJGGQKfW1MaBT6c6hlTvYtdB41bMu/s50/blogger-nophoto.png';
var another_au='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEju5Wl8zsKFiYsF653csgceF_yd-gK1BfmgzZSQqmAXD4iPe7VxNoQ-lQ7ChHB8Bds3X0RTxXDNmI3_4thyphenhyphenwphLoz7EZvw32z3bxtzasuZedmuvApdWsIDbUT9dBSi8BfRk1zS54blnXdVW/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
- Thêm tác giả, quyền Admin cho blogspot
- Hiển thị nhãn (label) phong cách màu tím cực nổi cho blogspot [V3]
- Thêm Google translate - dịch đa ngôn ngữ cho Blogspot
- Cài đặt theo dõi Google analytics cho blogspot
- Cách tạo khung Form đăng nhập cho blogspot
- Thêm chia sẻ Like và share bài viết cho blogspot [trên trang itviet360]
- Thêm nút theo dõi (Follow) cho blogspot
- Feedburner Google và cách lấy tùy chỉnh cho blogspot
- Tiện ích Popular Posts - Bài xem nhiều với CSS3
- Mạng xã hội theo dõi với hiệu ứng rê chuột cho blogspot
- Mudim - Thêm bộ gõ tiếng Việt cho blogspot
- Hiệu ứng màu chạy lấp lánh trong chữ cho blogspot
Comments[ 0 ]
Đăng nhận xét