Cara Membuat winget Recent Post Sesuai Label di Blog bergambar Thumnail

Recent post Thumnail Berdasarkan Label bisa membuat blog terorganisir dengan baik, sehingga membuat pengunjung dapat dengan mudah menemukan topik yang mereka cari.

Pada Recent post kali ini hanya menampilkan postingan terbaru berdasarkan kategori, sehingga kita bisa menampilkan postingan terbaru untuk setiap kategori dan juga menampilkan gambar untuk setiap kategori.

Nah, untuk Anda yang berkeinginan memasang widget Recent Post berdasarkan Label, bisa mengikuti langkah-langkahnya di bawah ini :


1. Layout > Add a gadhet > HTML/Javascript

2. Masukkan (Copas) kode berikut ini

3. Save!




<style>
img.recent_thumb {padding:1px;width:72px;height:72px;border:0; float:left;margin:0 10px 5px 1px;}.recent_posts_with_thumbs {float: right;width: 100%;min-height: 72px;margin: 5px 10px 5px 0px;padding: 0;font-size:12px;}ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:72px;}.recent_posts_with_thumbs a {text-decoration:none;}.recent_posts_with_thumbs strong {font-size:10px;} 

</style>
<script>

function showrecentpostswiththumbs(json) {document.write('<ul class="recent_posts_with_thumbs">'); for (var i = 0; i < numposts; i++) {var entry = json.feed.entry[i];var posttitle = entry.title.$t;var posturl;if (i == json.feed.entry.length) break;for (var k = 0; k < entry.link.length;k++){ if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;} if (entry.link[k].rel == 'alternate') {posturl = entry.link[k].href;break;}}var thumburl;try {thumburl=entry.media$thumbnail.url;}catch (error) { 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!="")){ thumburl=d;} else thumburl='http://lh4.ggpht.com/_IjrRiI_bVb0/TOCYn1fMjII/AAAAAAAAF24/5Fvv-HJqh74/loading-2.gif'; }

var postdate = entry.published.$t;var cdyear = postdate.substring(0,4);var cdmonth = postdate.substring(5,7);var cdday = postdate.substring(8,10);var monthnames = new Array();monthnames[1] = "Jan";monthnames[2] = "Feb";monthnames[3] = "Mar";monthnames[4] = "Apr";monthnames[5] = "May";monthnames[6] = "Jun";monthnames[7] = "Jul";monthnames[8] = "Aug";monthnames[9] = "Sep";monthnames[10] = "Oct";monthnames[11] = "Nov";monthnames[12] = "Dec";document.write('<li class="clearfix">'); if(showpostthumbnails==true)

document.write('<img class="recent_thumb" src="'+thumburl+'"/>'); document.write('<b><a href="'+posturl+'" target ="_top">'+posttitle+'</a></b><br>');

if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
var re = /<S[^>]*>/g;
postcontent = postcontent.replace(re, "");
if (showpostsummary == true) {
if (postcontent.length < numchars) {
document.write('<i>');
document.write(postcontent);
document.write('</i>');}
else {
document.write('<i>');
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0,quoteEnd);
document.write(postcontent + '...');
document.write('</i>');} }
var towrite='';var flag=0;
document.write('<br><strong>');

if(showpostdate==true) {towrite=towrite+monthnames[parseInt(cdmonth,10)]+'-'+cdday+' - '+cdyear;flag=1;}

if(showcommentnum==true)
{
if (flag==1) {towrite=towrite+' | ';}
if(commenttext=='1 Comments') commenttext='1 Comment';
if(commenttext=='0 Comments') commenttext='No Comments';
commenttext = '<a href="'+commenturl+'" target ="_top"&
gt;'+commenttext+'</a>';
towrite=towrite+commenttext;
flag=1; ;
}
if(displaymore==true)
{
if (flag==1) towrite=towrite+' | ';
towrite=towrite+'<a href="'+posturl+'" class="url"
target ="_top">Read more&#187;&#187;</a>';
flag=1;
;
}
document.write(towrite);
document.write('</strong></li>');
if(displayseparator==false)
if (i!=(numposts-1))
document.write('<hr color="#d9f1fa" size=0.5>'); }document.write('</ul>');

}
</script>
<script>

var numposts = 5;var showpostthumbnails = true;var displaymore = false;var displayseparator = true;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 100; </script><script src="AlamatBlog/feeds/posts/default/-/LABEL?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs"> </script> <div class="clear"/> </div>



3. Save!

Catatan : Pada kode yang saya beri warna merah Nama-Label, ganti dengan label ingin Anda tampilkan pada sidebar.

Pada widget ini hanya menampilan postingan baru per-label, jika Anda ingin menampilkan postingan dengan label lain silangkan ulangi cara pada nomor delapan saja. Cukup sekian dari saya, dan terima kasih.

0 Comments:

Posting Komentar