Membuat Widget Recent Post Sederhana di Blog

widget recent post sederhana
Recent post berfungsi untuk memudahkan pengunjung menemukan artikel atau posting terbaru di blog kita. karena banyak pengunjung organik yang langsung membuka artikel kita bukan di home page. Namun kadang-kadang dengan menambah widget akan semakin memberatkan loading blog. Dan tampilan blog yang sederhana akan jauh lebih menarik minat pengunjung ketimbang tampilan yang terlalu ramai. Ramai bisa saja dari segi pewarnaan yang terlalu banyak menggunakan warna berbeda atau penggunaan widget yang berlebihan.

Sehingga pada kesempatan kali ini, Kang Muroi akan berbagi script recent post yang sederhana sehingga tidak memberatkan loading blog. Namun meski sederhana, recent posts ini cukup elegant karena bisa menyesuaikan diri dengan tema blog. Contohnya bisa dilihat pada sidebar blog ini.

Untuk langkah pemasanganya sangatlah mudah, Anda tinggal copy dan pastekan script dibawah ini ke add gadget - HTML/Java Script dan masukkan kode dibawah ini.
<script>
//<![CDATA[
function showlatestposts(json){document.write('<ul id="recent-posts">');for(var i=0;i<7;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var postsurl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){postsurl=entry.link[k].href;break;}}
document.write('<li class="recent-posts">');document.write('<a href="'+ postsurl+'" target ="_top" title="'+ posttitle+'">'+ posttitle+'</a>');document.write('</li>');}
document.write('</ul>');};
document.write("<scr" + "ipt type=\"text/javascript\" src=\"/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showlatestposts\"></scr" + "ipt>");
//]]>
</script>
 Cukup mudah bukan, selamat mencoba
Next Post Previous Post
Add Comment
comment url
Terima kasih telah berkomentar di Blog Guru Madrasah.
  • Untuk menyisipkan Gambar, Kode, atau Kutipan silahkan klik Tab Sisipkan di atas.
  • Emoji yang bisa digunakan pada komentar :), :D, :( <3, :love dan :top
  • Berkomentarlah sesuai topik dengan baik dan sopan
Masukkan URL Gambar atau Potongan Kode, atau Quote, lalu klik tombol yang kamu inginkan untuk di-parse. Klik tombol Salin Kode! lalu paste ke kolom komentar.


image quote pre code
sr7themes.eu.org