Cara Membuat Recent Post Widget di blog

Cara Membuat Recent Post Widget di blog - setelah mimin share kemarin tentang Cara merubah scrollbar  sekarang mimin akan share membuat recent post widget di blog sobat dengan cara yang cukup mudah dan tidak ribet-ribet amat.

fungsi dari recent post sendiri ialah memunculkan artikel terbaru kita di bagian sidebar jadi para pengunjung mudah mengetahui artikel apa yang terbaru di blog sobat. berikut cara membuat widget recent post yang ringan dan tidak membebankan blog,

Cara Membuat Recent Post Widget di blog :

1. masuk ke blog sobat > ke menu tata letak > tambahkan gadget > pilih yang HTML/Javascript
2. jika sudah sobat masukkan kode dibawah ini,

<style scoped='' type="text/css">


ul#recent-posts{list-style:none;margin:0;padding:0}li.recent-posts{display:block;clear:both;overflow:hidden;list-style:none;border-bottom:1px solid #e3e3e3;word-break:break-word;padding:10px 0;margin:0;}

li.recent-posts:last-child{border-bottom:0;}
li.recent-posts a{color:#444;}li.recent-posts a:hover{color:#444;text-decoration:underline}
</style>
<ul id="recent-posts"></ul>
<script>
//<![CDATA[

var homePage = "http://www.warungbiru.com",


numPosts = 5;


function recentPosts(a){if(document.getElementById("recent-posts")){var e=a.feed.entry,title,link,content="",ct=document.getElementById("recent-posts");for(var i=0;i<numPosts;i++){for(var j=0;j<numPosts;j++){if(e[i].link[j].rel=="alternate"){link=e[i].link[j].href;break}}var title=e[i].title.$t;content+='<li class="recent-posts"><a href="'+link+'" title="'+title+'" target="_blank" rel="nofollow">'+title+'</a></li>'}ct.innerHTML=content}}var rcp=document.createElement('script');rcp.src=homePage+'/feeds/posts/summary?alt=json-in-script&orderby=published&max-results='+numPosts+'&callback=recentPosts';document.getElementsByTagName('head')[0].appendChild(rcp);

//]]>

</script>

Ubah url yang sudah saya tandai, dengan url blog sobat
3. kemudian sobat tinggal Simpan dan bisa langsung lihat hasilnya di blog sobat

Cara Membuat Recent Post Di blog
 sekian tutorial mimin tentang Cara Membuat Recent Post Widget di blog, bila sobat ada kesulitan bisa berkomentar di bawah.

8 comments

  1. wah scriptnya bikin pusing juga nih gan.
    izin buat bookmark dulu ya

    ReplyDelete
    Replies
    1. mudah kok gan ^_^ tinggal masukin aja ke add gadget pilih > html/javascript masukin deh kodenya..

      Delete
    2. kalau tinggal copas mudah bro :D
      hehe izin buat mahamin scriptnya ya

      Delete
  2. ini recent postnya ukuranya udah otomatis mengikuti ukurannya yah gan ? misalnya di sidebar terus ukuranya udah otomatis mengikuti ukuran sidebar nya ?

    ReplyDelete
  3. Recent post ini akan nampak gimana ya gan? Biasanya tuh pengguna maunya yang SEO Friendly. Kira-kira cocoknya template yang seperti apa dipasangi model beginian?

    ReplyDelete
  4. ijin pasang di blog saya mas, terima kasih....

    ReplyDelete
  5. mantab mas. simple tapi keren, thanks for sharing

    ReplyDelete