Tiện ích Recent Posts Bài Đăng Mới Nhất

* Cách thực hiện :

Xem Demo:

http://kythuatcongtrinh.blogspot.com/

1. Vào Thiết kế > Phần tử trang

2. Tạo một widget HTML\JavaScript và dán vào đoạn code bên dưới :

<style type="text/css">  

#ktct-rc {width:180px;margin:0;padding:10px;overflow:hidden;border:1px solid #ccc;background:url(http://i1082.photobucket.com/albums/j363/thanhnewcc/Sidebar.jpg)}  

.ktct-rc h2{background:#39c;color:#fff;line-height:1.6em;margin:0 0 10px;padding:4px 10px;font-size:12px;font-weight:bold}  

.ktct-rc ul{list-style:none;margin:0;padding:0}  

.ktct-rc li{text-indent:0;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZdj6-jgMOhlP4lX224KtF01AdcrjtRLZ_dMQodPuCcNj0vRm8jmsowDtf-Z99QKe1ZiH19VXmB4mK4uepwIWNEatYDPki9-lYdESSaiEHiIPy0_8OLpaHejNq8c-Spq-0GqiR-8Rzo8aE/) no-repeat 0 7px;line-height:1.5em;margin:0;padding:2px 0 2px 15px}  

.ktct-rc h2 a:link, .ktct-rc h2 a:visited {color:#fff}  

</style> 

<div id="ktct-rc" class="ktct-rc">  

<script type='text/javascript'>  

numposts = 5;  

list1 = 3;  

sumPosts = 25;  

maintitle = "#000"; 

subtitle = "#000"; 

home_page = "http://kythuatcongtrinh.blogspot.com/";

label = "Phần Mềm Xây Dựng - Kết Cấu";

</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;} else{img[i]="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyfq8k1rxt7YDBIkEIykMepopIP0n0SKzvOSGsHCCrfq-mpK9Ib4X2TVFh8WtreKXVF6c_fm8bkHN_Gt0Tcl5WUmvag17DNs_ObitZ5q8Mp0c9bFd6I-PSkut0pl0WUi5FiUEI32fT5pc/s400/noimage.png";}  
        var l = '<table border="0" cellpadding="0" cellspacing="0" style="margin-bottom:5px;border-bottom:double #eee"><tr><td><img width="50" height="50" src="' + img[i] + '" align="left" border="0" title="' + g + '" alt="' + g + '" style="margin:5px 10px 0 0"><a href="' + h + '" style="color:'+maintitle+'"><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 + '" style="color:'+subtitle+'">' + g + '</a></li>';  
        if ((i >= 0) && (i < list1)) {  
            var n = l  
        }  
        if (i == list1) {  
            var n = '<div class="ktct-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=\""+home_page+"feeds/posts/default/-/"+label+"?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");

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

* Trong đoạn code trên : 

• numposts = ; : tổng số bài viết được hiển thị
• list1 = ; : số bài viết hiển thị kèm ảnh thumbnail
• sumPosts = ; : số ký tự mô tả ( summary )
• maintitle = ""; : màu tiêu đề bài viết đầu tiên ( có ảnh và trích dẫn )
• subtitle = "";: màu tiêu đề các bài viết tiếp theo

Chúc Bạn Thành Công.

Posted in: Thủ Thuật Blogspot