Giới thiệu 1 chút về Recent Posts là widget cập nhật thông tin bài viết mới nhất của blog hoặc theo một nhãn (label) của blogger. Recent Posts dễ dàng tùy biến và không làm ảnh hưởng lớn tới tốc độ load của Website. Widget này thích hợp để làm site Tin tức và phù hợp với những bạn làm website thủ thuật
Và sau đây mình xin hướng dẫn các bạn Tạo Recent Posts với style tin tức đẹp cho Blogger
Và sau đây mình xin hướng dẫn các bạn Tạo Recent Posts với style tin tức đẹp cho Blogger
Để tạo widget Recent Posts, các ban thực hiện các bước sau:
Bước 1: Các bạn vào Bố cục→Thêm tiệc ích HTML→Thêm đoạn code sau:
<style type="text/css">
#rc-plus {width:260px;margin:0;padding:10px;overflow:hidden;border:1px solid #ccc;background:#fff}
.rc-plus h2{background:#39c;color:#fff;line-height:1.6em;margin:0 0 10px;padding:4px 10px;font-weight:bold}
.rc-plus ul{list-style:none;margin:0;padding:0}
.rc-plus li{text-indent:0;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhReoO1iEW2-7pVeh8uY39y7ZD9aaBzjMvflsBw-rB1g8Li6qU3tsYI3muxtUATKKqlAwLRjt6reBkefTZpfYu1ASxea6y9AKPXw8zkgsAeTo00SXVBs8eciTgQUNqtCq0xrFMUhEe1MUL9/) no-repeat 0 7px;line-height:1.5em;margin:0;padding:2px 0 2px 15px}
.rc-plus h2 a:link, .rc-plus h2 a:visited {color:#fff}
</style>
<div id="rc-plus" class="rc-plus">
<h2><a href="http://www.ichiase.biz/search/label/Thủ%20Thuật%20Blogger">Thủ thuật Blogger</a></h2>
<script type='text/javascript'>
numposts = 5; list1 = 1; sumPosts = 168;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(a, b) {
var s = a.split("<");
for (var i = 0; i < s.length; i++) {
if (s[i].indexOf(">") != -1) {
s[i] = s[i].substring(s[i].indexOf(">") + 1, s[i].length)
}
}
s = s.join("");
s = s.substring(0, b - 1);
return s
}
function showrecentposts(e) {
img = new Array();
for (var i = 0; i < numposts; i++) {
var f = e.feed.entry[i];
var g = f.title.$t;
var h;
if (i == e.feed.entry.length) break;
for (var k = 0; k < f.link.length; k++) {
if (f.link[k].rel == 'alternate') {
h = f.link[k].href;
break
}
}
if ("content" in f) {
var j = f.content.$t
} else if ("summary" in f) {
var j = f.summary.$t
} else
var j = "";
s = j;
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 != "")) img[i] = d;
var l = '<table border="0" cellpadding="0" cellspacing="0" style="margin-bottom:5px;border-bottom:double #eee"><tr><td><img width="110" height="85" src="' + img[i] + '" align="left" border="0" title="' + g + '" alt="' + g + '" style="margin:5px 10px 0 0"><a href="' + h + '"><b>' + g + '</b></a><p style="margin:0;padding:5px 0 10px">' + removeHtmlTag(j, sumPosts) + ' ...</p></td></tr></table>';
var m = '<li><a href="' + h + '">' + g + '</a></li>';
if ((i >= 0) && (i < list1)) {
var n = l
}
if (i == list1) {
var n = '<div class="rc-plus"><ul>' + m
}
if ((i > list1) && (i < numposts - 1)) {
var n = m
}
if (i == numposts - 1) {
var n = m + '</ul></div>'
}
document.write(n)
}
}
document.write("<script src=\"http://www.ichiase.biz/feeds/posts/default/-/Phần mềm?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
//]]>
</script>
</div>
Lưu ý: Các bạn thay http://www.ichiase.biz thành địa chỉ blog của bạn.
-Thủ Thuật Blogger">Thủ thuật Blogger</a></h2> là tiêu đề của widget.
-Phần mềm là Nhãn(label) hiển thị của wiget.
-Nếu bạn muốn widget hiển thị bài viết của tất cả các nhãn của Blog. Các bạn thay đoạn code
document.write("<script src=\"http://www.ichiase.biz/feeds/posts/default/-/Phần mềm?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
thành đoạn code
document.write("<script src=\"http://www.ichiase.biz/feeds/posts/default/?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
-Trong đoạn code trên
numposts = 5: số bài viết hiển thị;
list1 = 1: số lượng bài viết có hình ảnh avatar;
sumPosts = 168: số kí tự của mô tả;
Nguồn : VănViet Blog's
Đăng nhận xét