Mẫu bài đăng mới nhất cho blogger - Style 2

 humghn.com 

Hiện nay có rất nhiều các mẫu " Bài đăng mới nhất " trên các trang mạng . Nhưng các mẫu đẹp và chất lượng thực sự thì ... chỉ đếm trên đầu ngón tay .  Trong mỗi một bài viết , chuyên mục luôn cố gắng lọc ra những mẫu đẹp nhất để gửi tới các bạn . Ngoài ra , kĩ thuật viên cũng cố gắng để loại các dải mã độc trong những mẫu có sẵn và tối ưu chúng một cách tốt nhất để đem lại sự tiện dụng cho bạn đọc . Sau một thời gian tìm kiếm và chọn lọc , chuyên mục sẽ tiếp tục gửi đến các bạn một mẫu " Bài đăng mới nhất - Recent Posts " được cho là khá chuyên nghiệp . 

Ảnh DEMO

Cách thực hiện 

Bước 1 ; Truy cập bloger ; chọn " Bố cục " ; Thêm tiện ích " HTML/JavaScript "

Bước 2 : Dán đoạn mã sau vào tiện ích HTML vừa tạo

<style type="text/css">
#thietkeblogger-rc {width:300px;margin:0;padding:10px;overflow:hidden;border:1px solid #ccc;background:#fff}
.thietkeblogger-rc h2{background:#39c;color:#fff;line-height:1.6em;margin:0 0 10px;padding:4px 10px;font-weight:bold}
.thietkeblogger-rc ul{list-style:none;margin:0;padding:0}
.thietkeblogger-rc li{text-indent:0;background:url(http://4.bp.blogspot.com/-TVFMWMC-lZw/UasMPl5QstI/AAAAAAAADVw/Th-PSA_b3SI/s1600/tag_blue.gif) no-repeat 0 7px;line-height:1.5em;margin:0;padding:2px 0 2px 15px}
.thietkeblogger-rc h2 a:link, .thietkeblogger-rc h2 a:visited {color:#fff}
</style>
<div id="thietkeblogger-rc" class="thietkeblogger-rc">
<h2><a href="http://www.humghn.com/search/label/Blogger?&amp;max-results=5">Thủ thuật blog</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="thietkeblogger-rc"><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=\"https://googledrive.com/host/0B_dL7bz8SOIxNGR3RE56MXBkQkE/"+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");

//]]>
</script>
</div>

Tùy chỉnh : 
- numposts = 5; : tổng số bài viết được hiển thị
- list1 = 1; : số bài viết hiển thị kèm ảnh thumbnail
- sumPosts = 168; : số ký tự mô tả (summary)
- Thay  http://www.humghn.com/ thành URL địa chỉ blog của bạn.
- Thay Blogger thành nhãn muốn hiển thị bài đăng mới nhất ( Trong trường hợp hiển thị bài mới nhất của một nhãn nào đó .
Nếu bạn muốn hiển thị bài mới nhất cho cả site thì bạn thay đoạn code

document.write("<script src=\"https://googledrive.com/host/0B_dL7bz8SOIxNGR3RE56MXBkQkE/"+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");

Thành đoạn code sau

document.write("<script src=\"https://googledrive.com/host/0B_dL7bz8SOIxNWE4b2hhR0w5SkE/"+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");

Bước 3 : Lưu lại và tận hưởng thành quả .
Chúc các bạn thành công .