Recent Comments widget cho Blogger

Custom recent-comments blogger
Như title bài viết, đây là một widget dành riêng cho blogspot, nó giúp chúng ta hiển thị những bình luận mới nhất trên blog với khả năng tùy chỉnh cao. Khác với widget cùng chức năng, nó không những hiển thị đoạn bình luận mà còn cho phép hiển thị ngày tháng, tên bài viết, và cả liên kết read more đến bài viết.

#bl2 Chúng ta không cần can thiệp đến template mà chỉ cần thêm một gadget HTML/Javascript vào layout là công việc xem như hoàn tất. Step by step cụ thể sau đây

• Vào Layout > Add a gadget > HTML/JavaScript
• Copy và dán đoạn code bên dưới đây vào gadget

<script src="https://salipropham-blogspot-com.googlecode.com/files/rcblogger-min.js" style=text/javascript>
/*
* Recent comments blogger - blogspot
* Collected by SaliproPham {http://salipropham.blogspot.com}
* Update 22/05/2012 
*/
</script>
<script style=text/javascript >
var numberOfComments=5;
var displayDate=true;
var displayArticle=true;
var summaryLength=100;
</script>
<script src=http://DiaChiBlogCuaBan/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></script>
<noscript>Your browser does not support JavaScript!</noscript>

#bl2 Chú ý thay DiaChiBlogCuaBan thành địa chỉ blog nhé. Và đây là đoạn CSS, chúng ta có thể để chung với phần trên.

<style>
span#rc-author a, span#rc-author a.visited{
text-decoration: none;
color: 
#3598F4;
font-weight: bold;
}
span#rc-author {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqcYDva7YU_DhBQDLMk1UNuzSxhyQ2t_EGX09CQC_w5QDNNqPMYFK7w1wXaKqhB2LlcAlq0l_XAtvEroREsecz0DVVVPLot18gdXqEfu3fepvzerxR-z1MDKl04rop-j4y0WBADMpftkrF/s20/dialog.png) no-repeat 0px 2px;
padding-left: 23px;
}
.rc-comments a, .rc-comments a.visited{
color: #A884E0;
}
div.rc-comments {
margin: 0px 10px 0 2px;
border-bottom: 1px dotted 
#AAA;
padding: 5px 0px;
}
div.rc-comments:hover {
background: url(https://lh4.googleusercontent.com/--nlm0PshPKE/T61LqETO8YI/AAAAAAAACVo/j3eeByvsfZc/s45/bg-tab-menu-sidebar-hover2.png) repeat-x left -6px;
}
</style>

Save và bạn đã có những gì mình muốn. @love

SHARE