Cara Mudah Memasang Widget Artikel Terbaru di Blogspot

Selamat datang kembali di Demo IdBoegis, Blog yang membahas seputar Tips Adsense, Tips Komputer, Tutorial Blog, SSH Gratis, Tips Youtube, Tips Smartphone dan informasi internet lainnya.

Pada Artikel kali ini kita akan membahas Cara Mudah Memasang Widget Artikel Terbaru di Blogspot, Postingan ini masih berhubungan dengan Artikel Widget.

Baca juga:

Cara Mudah Memasang Widget Artikel Terbaru di Blogspot

Advertisement

Cara membuat widget recent post - Sebelumnya saya sudah membagikan tutorial mengenai cara memasang widget artikel terbaru perlabel, maka pada kesempatan kali ini saya akan memberikan tutorial mengenai cara memasang widget recent secara umum. Memasang widget ini bertujuan untuk menampilkan update posting artikel terakhir, widget ini sangat disarankan untuk blog yang memiliki banyak kategori. Widget ini juga akan membuat pengunjung blog anda betah berada di blog anda, Widget ini juga cukup ringan untuk di pasang di blog tanpa menghambat loading blog sobat, Baiklah, langsung saja ke langkah-langkahnya berikut.

Cara Memasang Widget Recent Post

1. Pertama silahkan masuk dulu ke blogger
2. Pilih Tata Letak -> Tambah Gadget -> HTML/Javascript

3. Silahkan masukkan script di bawah ini ke dalamnya

 <style scoped='' type='text/css'>
#recent-posts{color:#999;font-size:12px}
#recent-posts img{background:#fafafa;float:left;height:60px;margin-right:8px;width:60px;border-radius:4px}
#recent-posts ul{margin:0;padding:0}
#recent-posts ul li{margin:0 0 10px 0;padding:0 0 10px 0;border-bottom:1px solid rgba(0,0,0,0.1)}
#recent-posts ul li:last-child{border-bottom:0}
#recent-posts ul li a{display:block;color:#222;font-weight:700;text-decoration:none;font-size:14px;margin:0 0 10px 0;line-height:normal}
</style>
<div id='recent-posts'>
<script type='text/javaScript'>
var rcp_numposts=5;
var rcp_snippet_length=150;
var rcp_info='yes';
var rcp_comment='Comments';
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="http://lh3.ggpht.com/--Z8SVBQZ4X8/TdDxPVMl_sI/AAAAAAAAAAA/jhAgjCpZtRQ/no-image.png"};}};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>  

4. Kemudian simpan dan lihat hasilnya
*Perhatikan kode yang saya tandai di atas atau kode di bawah ini :

var rcp_numposts=5; --------------------- jumlah post terakhir yg di tampilkan
var rcp_snippet_length=150; ------------- jumlah karakter huruf
var rcp_info='yes'; --------------------- menampilkan deskripsi
var rcp_comment='Comments';  ------------ menampilkan jumlah komentar

Silahkan ganti costumisasi di atas sesuai dengan keinginan sobat.

Demikian artikel kali ini mengenai cara memasang/ membuat widget recent post di blog. Terimakasih telah membaca artikel di atas, apabila sobat memiliki pertanyaan, silahkan tinggalkan pada kotak komentar. Selamat mencoba :)