Bài Viết Mới Nhất

Thứ Ba, 10 tháng 1, 2017

Thêm Tiện Ích Bình Luận Gần Đây Cho Blogger

 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:

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&amp;callback=allbloggertricks_recent&amp;&amp;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 !!!

Bài viết liên quan