Sau đây mình sẽ hướng dẫn các bạn tạo tiện ích "Bình luận gần đây" cho Blogger. Tiện ích có dạng như sau:
Dạng này khi trỏ chuột vào một lời nhận xét của ai đó được hiển thị trên mục, nó sẽ nghiêng một chút về bên phải. Rất đẹp phải không nào? Cách làm như sau:
Bước 1: Vào bố cục → Thêm tiện ích → HTML/Javascript
Bước 2: Coppy toàn bộ đoạn code sau dán vào nội dung phần HTML/Javascript:
![]() |
Tiện ích Bình luận gần đây - Khải Nguyễn Đăng |
Dạng này khi trỏ chuột vào một lời nhận xét của ai đó được hiển thị trên mục, nó sẽ nghiêng một chút về bên phải. Rất đẹp phải không nào? Cách làm như sau:
Bước 1: Vào bố cục → Thêm tiện ích → HTML/Javascript
Bước 2: Coppy toàn bộ đoạn code sau dán vào nội dung phần HTML/Javascript:
<style type="text/css" scoped>
ul.allbloggertricks_recent{list-style:none;margin:0;padding:0;}
.allbloggertricks_recent li{background:none!important;display:block;clear:both;overflow:hidden;list-style:none;border:1px solid transparent;border-radius:9px;max-height:100px;-webkit-transition-duration:.5s;-moz-transition-duration:.5s;-o-transition-duration:.5s;transition-duration:.5s;-webkit-transition-property:0;-moz-transition-property:0;-o-transition-property:0;transition-property:transform;margin:0 0 6px!important;padding:3px!important}
.allbloggertricks_recent li:hover{border:1px solid #ddd;
-webkit-transform:rotate(6deg);-moz-transform:rotate(6deg);-o-transform:rotate(6deg) }
.allbloggertricks_recent a {text-decoration:none;}
.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;width:35px;height:35px}
.allbloggertricks_recent li span{margin-top:4px;color: #222;display: block;font-size: 12px;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
var
numComments = 5,
showAvatar = true,
avatarSize = 35,
roundAvatar = true,
characters = 40,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
maxfeeds=50,
adminBlog='Nguyễn Đăng Khải';
//]]>
</script>
<script type="text/javascript" src="http://files.allbloggertricks.com/Scripts/abt-recent-commentsv3.js"></script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&callback=allbloggertricks_recent&&max-results=50">
</script> Cuối cùng, các bạn chỉ việc lưu lại và quay lại Blogger xem thành quả
Chúc các bạn thành công !!!
var
numComments = 5,
showAvatar = true,
avatarSize = 35,
roundAvatar = true,
characters = 40,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
maxfeeds=50,
adminBlog='Nguyễn Đăng Khải';
//]]>
</script>
<script type="text/javascript" src="http://files.allbloggertricks.com/Scripts/abt-recent-commentsv3.js"></script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&callback=allbloggertricks_recent&&max-results=50">
</script> Cuối cùng, các bạn chỉ việc lưu lại và quay lại Blogger xem thành quả
Chúc các bạn thành công !!!