Beranda » Widget » Widget Recent Post Thumbnail untuk blogger

Widget Recent Post Thumbnail untuk blogger

Widget Recent Post Thumbnail untuk blogger

Recent Posts dengan miniatur gambar - widget ini memudahkan pengunjung blog anda untuk menemukan postingan baru/terupdate di blog anda. membuatnya juga mudah seperti memasang Random Post yang pernah saya posting.

Demo

caranya adalah sebagai berikut:

Langkah 1: Tambahkan kode berikut sebelum tag ]]></b:skin> dalam template Anda.

#recent-posts img{
float:left;
margin-right:10px;
border:1px solid #999;
background:#FFF;
width:36px;
height:36px;
padding:3px
}

atau kalau anda malas edit template, tambahkan tag pembungkus <style> dan </style> di css lalu tempatkan bersama dalam satu widget dengan kode scripnya.

Jika anda telah memasang Random Posts untuk Blogger anda lewatkan saja langkah di atas dan ganti kode css #recent-posts di atas menjadi #random-posts karena kedua cssnya sama, kecuali anda telah melakukan perubahan.

Langkah 2: Tambahkan 1 widget HTML / Javascript di element untuk menempatkan widget Recent Posts ini. Teks Editing dan paste kode berikut ke dalam konten dan pilih SAVE.

<div id='recent-posts'>
<script type='text/javaScript'>
var rcp_numposts=5;
var rcp_snippet_length=150;
var rcp_info='yes';
var rcp_comment='Nhận xét';
var rcp_disable='Tắt Nhận xét';
function recent_posts(json){var dw='';a=location.href;y=a.indexOf('?m=0');dw+='<ul>';for(var i=0;i<rcp_numposts;i++){var entry=json.feed.entry[i];var rcp_posttitle=entry.title.$t;if('content'in entry){var rcp_get_snippet=entry.content.$t}else{if('summary'in entry){var rcp_get_snippet=entry.summary.$t}else{var rcp_get_snippet="";}};rcp_get_snippet=rcp_get_snippet.replace(/<[^>]*>/g,"");if(rcp_get_snippet.length<rcp_snippet_length){var rcp_snippet=rcp_get_snippet}else{rcp_get_snippet=rcp_get_snippet.substring(0,rcp_snippet_length);var space=rcp_get_snippet.lastIndexOf(" ");rcp_snippet=rcp_get_snippet.substring(0,space)+"&#133;";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rcp_commentsNum=entry.thr$total.$t+' '+rcp_comment}else{rcp_commentsNum=rcp_disable};if(entry.link[j].rel=='alternate'){var rcp_posturl=entry.link[j].href;if(y!=-1){rcp_posturl=rcp_posturl+'?m=0'}var rcp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rcp_thumb=entry.media$thumbnail.url}else{rcp_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfWAirU9cOiAvNOonq5y9bwyR2z16YSQIwvDrXku4Nia4aLwqV6zHkEnTrkJiNRP_a1FWQBhxcfDwa-V4ADwqMmmuKmNerx5c3G2CjH8xstPLBtJokYlfdI2iE_IV6jt4foNfwzxyR7ZBC/"};}};dw+='<li>';dw+='<img alt="'+rcp_posttitle+'" src="'+rcp_thumb+'"/>';dw+='<div><a href="'+rcp_posturl+'" rel="nofollow" title="'+rcp_snippet+'">'+rcp_posttitle+'</a></div>';if(rcp_info=='yes'){dw+='<span>'+rcp_postdate.substring(8,10)+'/'+rcp_postdate.substring(5,7)+'/'+rcp_postdate.substring(0,4)+' - '+rcp_commentsNum+'</span>';};dw+='<div style="clear:both"></div></li>';};dw+='</ul>';document.getElementById('recent-posts').innerHTML=dw;};document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results='+rcp_numposts+'&callback=recent_posts\"><\/script>');
</script>
</div>

Ganti 5 dengan artikel yang ingin ditampilkan, 150 adalah jumlah karakter isi posting kutipan. Jika Anda tidak ingin menampilkan informasi tanggal dan posting juga jumlah komentar silahkan ubah yes menjadi no untuk perintah tidak.

Semoga membantu...

Widget Recent Post Thumbnail untuk blogger

Belum ada tanggapan untuk "Widget Recent Post Thumbnail untuk blogger "

Post a Comment