Đăng bởi Admin | 9/5/13 | 6 nhận xét
Với thủ thuật này, các commet của khách tham quan được xếp theo thứ tự mới nhất nằm trên hàng đầu tiên kèm theo ảnh avatar của khách (số lượng comments được hiển thị do bạn tuỳ chọn tối đa là 200 comment) và được chứa đựng trong một hộp gọn gàng có thanh trượt để bạn có thể kéo xuống phía dưới để đọc hết các comments mà không chiếm khoảng không gian của Blog .
Mời bạn bấm vào thẻ "Xem thử" phía dưới để trải nghiệm trước thủ thuật này.
Thủ thuật này cũng khá đơn giản, bạn đăng nhập vào Blog > Chọn Bố cục > Chọn thêm tiện ích HTML/Javacript . Sau đó copy tất cả đoạn code phía dưới dán vào.
CODE:
Theo :giapqb.blog
Thu thuat vi tinh
<center><div style="font-weight:bold; border: 2px #30a1db solid; padding:5px; text-align:center; background:#FFF380;"><span style="color: red; font-size: large;">Bình luận mới nhất của các bạn</div></span>
<div style="border: 5px solid orange; color: cyan; height: 450px; margin: 5px 0; overflow: auto; padding: 10px; text-align: left; width: 280px;">
<style type="text/css">
ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
.w2b_recent_comments li{background:none !important;margin:0 0 6px
!important;padding:0 0 6px 0
!important;display:block;clear:both;overflow:hidden;list-style:none;}
.w2b_recent_comments li
.avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px
#ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px
#ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
.w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 200,
showAvatar = true,
avatarSize = 60,
roundAvatar = true,
characters = 60,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script src="https://sites.google.com/site/dunghennessyjs/comment2.js" type="text/javascript"></script>
<script src="http://giapqb.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=200" type="text/javascript"></script>
</div>
</center>
Bây giờ bạn thay đổi các dòng lệnh màu đỏ, trong đó:
* Background: màu nền của tiêu đề phía trên
* Color: màu chữ tiêu đề.
* Bình luận mới nhất của các bạn: bạn có thể thay đổi chữ nào mà bạn muốn.
* Orange: màu của khung hộp, có thể thay red (đỏ), black (đen), white (trắng), Pink (hồng), yellow (vàng), green (xanh)....
* height: chiều cao của hộp.
* Width: chiều rộng của hộp
Thay đổi dòng lệnh màu xanh, trong đó:
* Color: Mã màu của comment
* Font-size: kích thước chữ comment
* AvatarSize: kích thước của Avatar
* Characters: số lượng từ của comment
* http://giapqb.blogspot.com bằng địa chỉ trang Blog của bạn
Thay đổi dòng lệnh màu vàng đây là số comments được hiển thị trong hộp (2 số này phải bằng nhau). Cuối cùng bấm Lưu lại rồi trở lại blog xem kết quả nha. Chúc các bạn thành công!!!Theo :giapqb.blog
Thu thuat vi tinh
ban cho minh hoi cach dua mot bai dang cu luon xuat hien o trang chinh (trang chinh minh chi cho hien thi co 1 bai viet
Trả lờiXóaTrang lồng chim
Trả lờiXóamình làm mãi không được nhỉ :(
Cảm ơn Giang Ngân Hoa mình đã thực hiện thành công theo sự chỉ dẫn của bạn. Cảm ơn thêm lần nữa.
Trả lờiXóaChúc mừng bạn !
Xóaxin chào Ngân Giang Hoa, bạn cho mình hỏi làm thế nào để mục các bài đã đăng hiển thị tên bài viết khoảng hơn 5 bài nhỉ, hiện giờ nó hiển thị ngày bắt đầu và ngày kết thúc thôi, mình thấy blog khác hiển thị trải suống hơn 10 bài điều này làm cho người đọc tìm thấy bài muốn tìm nhanh tróng nhơn. cảm ơn bạn.
Trả lờiXóaHiển thị nhiều bài hay ít là do mình lựa chọn khi tạo phân trang cho nó. Bạn có thể tham khảo các bài viết hướng dẫn về phân trang tại đây
Xóa