Cara Membuat Widget (Postingan Terbaru) yang Ringan dan Tanpa Gambar pada Blogspot

Cukup lama tidak membuat postingan tentang tutorial blog maka hari ini yang mendapatkan ide untuk menulis tentang cara mudah buat widget postingan terbaru yang cepat loading khusus bagi para pengguna blogspot yang akan dipasang pada sidebar blog. Mengapa harus membuat sendiri widget postingan terbaru ? sebab pada blogspot belum tersedia widget khusus untuk postingan terbaru atau recent post.

Berdasarkan informasi dari google bahwa blog yang baik yaitu memperhatikan navigasi postingan di blog. Maksud dari navigasi adalah widget-widget pada blog yang dapat membuat pengunjung dengan mudah untuk mengakses semua informasi yang tersedia di blog.

Lihat juga : 8 Manfaat Widget Blog di Blogspot yang Sering Digunakan

Contoh-contoh widget navigasi yang terdapat pada blog misalnya postingan terbaru (recent post), populer post, label atau kategori postingan dan arsip blog. Namun, perlu diketahui juga Jangan Berlebihan Pasang Widget Blog, Agar Blog Ringan (Buat Pemula) dengan begitu kecepatan blog untuk kenyamanan pengunjung tetap baik. Gunakan widget blog yang sangat dibutuhkan sekedar saja.

Membuat widget postingan terbaru sangatlah mudah sebab kita hanya menggunakan script yang nantinya dipasang pada HTML widget blog. Ada juga yang membuat widget postingan terbaru dengan menampilkan gambar tapi saya sendiri lebih senang tanpa gambar (thumbnail) sehingga terlihat simple dan cepat loading.

Membuat dan memasang widget postingan terbaru di blog

Seperti yang telah saya sebutkan di atas bahwa untuk membuat widget postingan terbaru hanya dengan menggunakan script yang telah tersedia di bawah dan akan dipasang melalui widget di tata letak dasboard blogspot.

1. Buka dasboard blog

2. Tata letak

3. Tambahkan gadget

Anda dapat memilih dimana akan memasang postingan terbaru, apakah di bagian sidebar atau footer. Namun saya sangat menyarankan untuk menempatkan di sidebar sehingga lebih mudah terlihat oleh pengunjung untuk mengetahui apa saja postingan yang baru diupdate pada blog anda.

4. Pilih HTML/JavaScript

5. Masukkan Script di bawah 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:#0033CC;}li.recent-posts a:hover{color:#000;text-decoration:underline}

</style>

<ul id="recent-posts"></ul>

<script>

//<![CDATA[

var homePage = "https://www.atobasahonadotcom",

numPosts = 10;

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>

Keterangan :

Ganti alamat blog dengan blog anda dan angka 10 adalah jumlah baris postingan terbaru, anda dapat menyesuaikan berapa jumlah postingan terbaru yang ingin ditampilkan (perhatingan warna merah).

6. Simpan pengaturan

Sekarang anda telah memiliki widget postingan terbaru (recent post) yang ringan dan terlihat sangat simple di blog. Dengan begitu dapat membuat pengunjung berlama-lama berselancar di blog milik anda. Semoga bermanfaat.

Lihat juga : Cara Gampang Pasang Widget Translate (Terjemahan) Online Untuk Blog di Blogspot