Đặc điểm của tiện ích này là bố trí bài viết đầu tiên dưới dạng: ảnh đại diện, tiêu đề bài viết và phần trích dẫn; các bài viết tiếp theo chỉ hiển thị tiêu đề. Ngoài ra có thể đặt ảnh đại diện chỉ định riêng cho một số nhãn phổ biến trong blogspot (dùng cho trường hợp bài viết không có ảnh). Trong tiện ích này có phần logo cho trang. Bạn có thể xem Demo bên dưới.
Để cài đặt tiện ích này bạn hãy thực hiện như sau:
Đăng nhập Blogger, vào Page Elements. Đặt toàn bộ đoạn code sau đây vào một tiện ích HTML/Javascript.
<style type="text/css">Trong đoạn code trên, bạn có thể tùy biến CSS khá dễ dàng sao cho phù hợp với blogspot của bạn. Đối với các bạn mới, nếu áp dụng gặp khó khăn gì, xin vui lòng nêu vấn đề bên dưới để cùng giải quyết.
#rcp-VIP {width: 300px;}
#rcp-VIP a:hover {color: #AC0101}
#rcp-VIP h4 {font-family:Arial,serif;font-size: 14px;font-weight: normal;line-height: 1;}
#logo {margin-bottom:15px;text-align:center;font-size: 18px;}
#rcp-VIP table {border-spacing: 0;height: 80px;margin-bottom: 10px;width: 290px;}
#rcp-VIP table td {vertical-align: middle;}
#rcp-VIP table a {color: #069;text-decoration:none}
#rcp-VIP table.first td.title {padding-top: 3px;border-bottom: 1px solid #202931;border-top: 1px solid #202931;height: 20px;}
#rcp-VIP table td.thumb {padding-top: 3px;text-align: center;width: 50px;}
#rcp-VIP table.first h4 {text-align: center;}
#rcp-VIP table.any h4 {border-bottom: 1px solid #202931;border-top: 1px solid #202931;margin-left: 10px;padding: 5px;}
#rcp-VIP table img {border: 1px solid #202931;height: 50px;width: 50px;}
#rcp-VIP table.first td.text {color: #000000;font-family: Tahoma;font-size: 14px;height: 60px;line-height: 1;padding-left: 10px;width: 240px;}
#rcp-VIP div.single li {background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitcleX-Xj0bBZPsIx2HCJ_-wWE8x2W44KWicOcPGbqGGuOSx-RBEadrOxg0MqKZmmUoXLPjmA4QmCZdtGjqIPzKKFsjbn932JCnmZdDRRnX2LzfsSmuPmGD6SMNfYP_1naw7HT-LdhImA/s1600/arrow_right.png) no-repeat scroll left 50%;height: 20px;line-height: 20px;padding-left: 20px;list-style:none}
#rcp-VIP div.single li a {height:50px;color: #069;font-family:Arial,serif;font-size: 14px;text-decoration:none}
#rcp-VIP div.single li a:hover{color: #AC0101}
#rcp-VIP div.single {height:45px}
</style>
<script type='text/javascript'>
//<![CDATA[
// Recent Posts from VIP Blogspot Widget by www.thuthuatblogger.info
function getTitle(entry,res) {
var t = entry.title.$t;
if(res) {
t = t.substring(0,res);
}
return t;
}
function getUrl(entry) {
var url;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
url = entry.link[k].href;
break;
}
}
return url;
}
function getContent(entry,res) {
var c = "";
if ("content" in entry) {
c = entry.content.$t;
} else if ("summary" in entry) {
c = entry.summary.$t;
}
if(res) {
c = removeHtmlTag(c,res);
}
return c;
}
function getThumbnail(entry) {
var t = "";
var s, a, b, c, d;
s = entry.content.$t;
a = s.indexOf("<img");
b = s.indexOf("src=\"",a);
c = s.indexOf("\"",b+5);
d = s.substr(b+5,c-b-5);
if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) { t = d; }
return t;
}
function removeHtmlTag(strx,chop){
var r = strx.split("<");
for(var i=0;i<r.length;i++){
if(r[i].indexOf(">")!=-1){
r[i] = r[i].substring(r[i].indexOf(">")+1,r[i].length);
}
}
r = r.join("");
var sss = "", p;
var r2 = r.split(" ");
for(var i=0;i<r2.length;i++){
p = sss + r2[i] + " "
if(p.length>=chop) {break;}
sss = p;
}
if(sss!=" ") {
sss += "…"
} else {
sss = "";
}
return sss;
}
function showrecentpostVIP(json) {
var entry, posttitle, posturl, postcontent, cat, strx_out;
var numposts = 6;
strx_out = "<div id='logo'><a title='' target='_blank' href='http://www.kienthucblogspot.info/'>KIENTHUCBLOGSPOT</a></div>"; // Bạn cần tùy biến chỗ này - có thể đặt URL_logo
for (var i = 0; i < numposts; i++) {
if (i == json.feed.entry.length) { break; }
posturl = "";
postcontent = "";
entry = json.feed.entry[i];
cat = entry.category[0].term;
posttitle = getTitle(entry);
posturl = getUrl(entry);
if(i==0) {
postcontent = getContent(entry,150); // Thay 150 chỉ số ký tự cho đoạn trích dẫn
postthumb = getThumbnail(entry); // Dưới đây đặt URL ảnh đại diện cho một số nhãn
if(postthumb=="") {
if(cat=="Tên nhãn 1"){postthumb = "URL_ảnh đại diện nhãn 1"}
if(cat=="Tên nhãn 2"){postthumb = "URL_ảnh đại diện nhãn 2"}
if(cat=="Tên nhãn 3"){postthumb = "URL_ảnh đại diện nhãn 3"}
if(cat=="Tên nhãn 4"){postthumb = "URL_ảnh đại diện nhãn 4"}
}
if(postcontent!="") {
strx_out += "<table class='first'>";
strx_out += "<tr><td class='title' colspan='2'><h4><a href='" + posturl + "' target='_blank'>" + posttitle + "</a></h4></td></tr>";
strx_out += "<tr>";
strx_out += "<td class='thumb' ><img src='" + postthumb + "' /></td>";
strx_out += "<td class='text'>" + postcontent + "</td>";
strx_out += "</tr>";
strx_out += "</table>";
} else {
strx_out += "<table class='any'>";
strx_out += "<tr>";
strx_out += "<td class='thumb' ><img src='" + postthumb + "' /></td>";
strx_out += "<td class='title'><h4><a href='" + posturl + "' target='_blank'>" + posttitle + "</a></h4></td>";
strx_out += "</tr>";
strx_out += "</table>";
}
} else {
strx_out += "<div class='single'><li><a href='" + posturl + "' target='_blank'>" + posttitle + "</a></li></div>";
}
}
document.write(strx_out );
}
//]]>
</script>
<div id="rcp-VIP">
<script src="/feeds/posts/default?max-results=6&alt=json-in-script&callback=showrecentpostVIP"></script>
</div>
- Bạn chèn thẻ liên kết (a tag).
- Nội dung gây khó chịu cho các bạn đọc khác.
- Thắc mắc không liên quan bài viết, hãy post tại Hỏi đáp.
- P/s : Comment chê Admin xấu trai cũng sẽ bị xóa không thương tiếc :D
Comment của bạn sẽ bị xóa nếu:
- Bạn chèn thẻ liên kết (a tag).
- Nội dung gây khó chịu cho các bạn đọc khác.
- Thắc mắc không liên quan bài viết, hãy post tại Hỏi đáp.
- P/s : Comment chê Admin xấu trai cũng sẽ bị xóa không thương tiếc :D