Cara Membuat Widget Postingan Terbaru di Sidebar Blog

Membuat sidebar postingan terbaru dari artikel blog sangatlah penting untuk mencari trafik pengunjung pada artikel yang baru saja dibuat, dengan begitu pengunjung dapat tertarik untuk membaca artikel yang dibuat. Tidak semua template blog yang dipasang pada blog memiliki fitur recent post ini, jadi sebagai pemilik blog harus membuatnya secara manual pada html.


Dan untuk membuatnya juga tidak begitu sulit, cukup meletakkan beberapa kode pada tag html dan javascript widget postingan terbaru dapat muncul pada halaman blog, dan berikut cara membuatnya.

Membuat Widget Postingan Terbaru

1. Login ke blog, dan Pergi ke Edit HTML


2. Cari kode ]]></b:skin> dan paste kan kode berikut tepat diatasnya

 /* CSS Recent Post  Thumbnail */
img.rct-thumb{width:72px;height:72px}
.rct-thumb {float: left;margin-right: 12px;width:72px;height:72px}
.recent-by-tag{width:100%;margin:0;padding:0}
ul.recent-by-tag li{padding:10px 0;margin-bottom:0;border-bottom:1px solid #f1f1f1}
ul.recent-by-tag li:first-child{padding:0;}
.recent-by-tag li{font-size:15px;list-style:none;padding-left:0;margin:0;padding:0;overflow:hidden}
.recent-by-tag a{font-size:15px;font-weight:normal;margin:0;}
.recent-by-tag strong{padding-left:0}
span.showdates{font-size:11px;margin:10px 0 0}
.recent-by-tag li:last-child {border-bottom:none;padding-bottom:0px;margin-bottom:0px;}

3. Dan cari kode </head> dan paste kode berikut diatasnya

<script type='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var showpostdate = true;
</script>
<script type='text/javascript'>
//<![CDATA[
function rcentbytag(e){document.write('<ul class="recent-by-tag">');for(var t=0;t<numposts;t++){var n=e.feed.entry[t];var r=n.title.$t;var i;if(t==e.feed.entry.length)break;for(var o=0;o<n.link.length;o++){if(n.link[o].rel=="replies"&&n.link[o].type=="text/html"){var u=n.link[o].title;var f=n.link[o].href}if(n.link[o].rel=="alternate"){i=n.link[o].href;break}}var l;try{l=n.media$thumbnail.url}catch(h){s=n.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!=""){l=d}else l="http://2.bp.blogspot.com/-giova1ZCh-A/Uzq6L8QTJNI/AAAAAAAAAJc/USXictTq_xs/s70-c/KM+Icon.png"}var p=n.published.$t;var v=p.substring(0,4);var m=p.substring(5,7);var g=p.substring(8,10);var y=new Array;y[1]="Januari";y[2]="Februari";y[3]="Maret";y[4]="April";y[5]="Mei";y[6]="Juni";y[7]="Juli";y[8]="Agustus";y[9]="September";y[10]="Oktober";y[11]="November";y[12]="Desember";document.write('<li class="clear">');if(showpostthumbnails==true)document.write('<a href="'+i+'" target ="_blank" title="'+r+'" rel="nofollow"><img class="rct-thumb" alt="'+r+'" src="'+l+'"/></a>');document.write('<strong><a href="'+i+'" target ="_top" title="'+r+'" rel="nofollow">'+r+'</a></strong>');document.write('<br>');var x="";var T=0;if(showpostdate==true){x='<span class="showdates">'+x+g+" "+y[parseInt(m,10)]+" "+v+"</span>";T=1}document.write(x);document.write("</li>");if(t!=numposts-1)document.write("")}document.write("</ul>")}
//]]>
</script>

4. Dan klik Simpan (Save Theme)
5. Pergi ke Layout (Tata Letak), pada bagian widget sidebar Klik add a gadget untuk menambahkan gadget baru


 6. Add HTML/Javascript


7. Paste kode berikut
<script type="text/javascript" src="/feeds/posts/default?orderby=updated&amp;alt=json-in-script&amp;callback=rcentbytag"></script>
8. Simpan.

Buka halaman blog kamu, dan lihat apa widget postingan sudah terlihat di sidebar nya, Jika ada selamat kamu telah berhasil membuatnya.
RELATED POSTS

Berlangganan update artikel terbaru via email:

0 Response to "Cara Membuat Widget Postingan Terbaru di Sidebar Blog"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel