Code recent comment cho blogspot Hung Ngo 08:39 No Comments Tweet Ai chơi blog thì cũng đều biết sự quan trọng của tiện ích Recent Commments (Nhận xét mới) bởi nó giúp tác giả / người đọc theo dõi một cách trực quan, tiếp diễn những thảo luận trên blog. Thật ra, tiện ích mặc định trên Blogger này cũng đã xưa hơn Diễm lâu rồi. Trong giới Blogger từ lâu đã và đang cho ra đời những tiện ích Nhận xét mới được "độ" và nâng cấp, tuyệt vời hơn cái phiên bản mặc định kia nhiều. Để giúp các bác blogger chưa có thời gian tìm hiểu kỹ về vấn đề này, hup chao blog xin tổng hợp 1 số kiểu tiện ích "Recent comments" như dưới đây.Bước 1:Trước hết, chúng ta xác định vị trí để chèn tiện ích này trên blog của mình (thường là các sidebar trái hoặc phải). Từ Blogger Dashboard → Layout → Xác định vị trí đặt tiện ích và "Add a Gadget" → chọn "HTML/JavaScript" trong danh sách Gadget hiện ra.Bước 2:Một cửa sổ nhập liệu hiện ra. Các bạn đặt tên cho nó và dán các đoạn mã của tiện ích vào rồi lưu lại (Save). Đoạn mã cho tiện ích thì các bạn có thể chọn 1 trong số 3 kiểu mà hupchao blog sẽ trình bày ngay sau đây.Bước 3:Như đã trình bày ở trên, hiện có khá nhiều kiểu "Recent comments". hupchao blog lựa chọn giới thiệu 2 đại diện của các "trường phái" phổ biến nhất để các bạn tùy nghi áp dụng vào blog mình sao cho phù hợp.1. Kiểu đơn giản: không có avatar người bình luận.Các bạn tham khảo hình ảnh dưới đây. Tiện ích sẽ thể hiện tên người nhận xét, tên bài viết có nhận xét và trích dẫn nhận xét. Đoạn mã cho kiểu tiện ích này như sau:<script style=text/javascript src="http://helplogger.googlecode.com/svn/trunk/recent comments widget.js"></script><script style=text/javascript >var a_rc=5;var m_rc=false;var n_rc=true;var o_rc=100;</script><script src=http://hupchao.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></script><style type=text/css> .rcw-comments a {text-transform: capitalize;} .rcw-comments {border-bottom: 1px dotted; padding-top: 7px!important; padding-bottom: 7px!important;} #rcw-cr {font-family: Arial,Tahoma;font-size:9px;padding-top:7px;display:block;} </style>Bạn chỉ cần thay đoạn http://hupchao.blogspot.com bằng đường link của blog mình. Số 5 quy định số nhận xét được hiển thị.2. Kiểu có hình đại diện (avatar) hình tròn:Bạn có thể tham khảo kiểu này ngay trên hupchao blog, mục "Nhận xét mới" ở sidebar. Rất đẹp phải không nào? Nhưng lưu ý là hiệu ứng ảnh hình tròn này chỉ hiển thị trên trình duyệt FireFox và Chrome chứ vô hiệu trên Internet Explorer.Đoạn mã của kiểu này như sau:<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 = 5, showAvatar = true, avatarSize = 60, roundAvatar = true, characters = 110, showMorelink = false, moreLinktext = "Xem thêm »", defaultAvatar = "http://www.gravatar.com/avatar/?d=mm", hideCredits = true; //]]></script><script type="text/javascript" src="http://shareallworld.googlecode.com/files/w2b-recent-comments-gravatar.js"></script><script type="text/javascript" src="http://hupchao.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>Thay đoạn http://hupchao.blogspot.com bằng đường link trang blog của bạn. Lưu tiện ích lại là xong.Chúc thành công!
