Home » » Widget Random Post Dengan Thumbnail Dan SEO Friendly

Widget Random Post Dengan Thumbnail Dan SEO Friendly

Written By Heri on Minggu, 22 Desember 2013 | 08.51

Widget Random Post (Per Label) Dengan Thumbnail Dan SEO Friendly by sharehovel

Widget Random Post Dengan Thumbnail Dan SEO Friendly - Widget Random Post (postingan acak) berfungsi untuk menampilkan postingan anda secara acak, baik itu postingan lama ataupun postingan terbaru. Sangat berguna apabila jumlah postingan anda sudah cukup banyak, misalnya ratusan, maka postingan-postingan lama anda berkemungkinan bisa dibaca kembali oleh pengunjung blog anda. Keuntungan yang anda dapat adalah pageviews dari setiap artikel anda bisa meningkat dari sebelumnya dengan adanya widget random post ini.

Nah, widget Random Post yang akan saya bagikan kali ini, cukup ringan dan tidak memberatkan loading blog anda karena hanya tampil judul postingan disertai thumbnail dengan ukuran yang minimalis. Selain itu, widget Random post ini juga bisa anda sesuaikan jika anda hanya ingin menampilkan postingan dengan label tertentu.

Dan yang lebih spesial adalah widget Random Post ini sudah saya modifikasi dari kode aslinya, agar SEO friendly. Saya sendiri tidak tahu siapa pembuat asli dari kode widget Random Post ini, karena ada begitu banyak blogger yang membagikan kode ini dan saya hanya memodifikasinya sedikit agar SEO friendly, tapi saya ucapkan terimakasih untuk pembuat asli dari kode ini. Ok, lanjut. Kenapa saya bilang SEO friendly? karena penambahan kode tag alt dan title pada javascript-nya untuk setiap thumbnail dan link judul postingan yang tampil pada widget Random Post ini.

Baiklah, berikut Cara Membuat Widget Random Post Dengan Thumbnail  dan SEO Friendly di Blog

1. Login ke akun Blog anda

2. Masuk ke munu Layout > Add A Gadget, kemudian pilih HTML/Javascript

3. Selanjutnya, masukan semua kode dibawah ini
<style>
<!--
#random-posts img{float:left;margin-right:10px;border:1px solid #999;background:#FFF;width:36px;height:36px;padding:4px}
-->
</style>
<ul id='random-posts'>
<script type="text/javascript">
var rdp_numposts=5;var rdp_snippet_length=100;
var rdp_info='no';
var rdp_comment='Comment';
var rdp_disable='';
var rdp_current=[];var rdp_total_posts=0;var rdp_current=new Array(rdp_numposts);function totalposts(json){rdp_total_posts=json.feed.openSearch$totalResults.$t}document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalposts\"><\/script>');function getvalue(){for(var i=0;i<rdp_numposts;i++){var found=false;var rndValue=get_random();for(var j=0;j<rdp_current.length;j++){if(rdp_current[j]==rndValue){found=true;break}};if(found){i--}else{rdp_current[i]=rndValue}}};function get_random(){var ranNum=1+Math.round(Math.random()*(rdp_total_posts-1));return ranNum};
</script>
<script type="text/javascript">
function random_posts(json){a=location.href;y=a.indexOf('?m=0');for(var i=0;i<rdp_numposts;i++){var entry=json.feed.entry[i];var rdp_posttitle=entry.title.$t;if('content'in entry){var rdp_get_snippet=entry.content.$t}else{if('summary'in entry){var rdp_get_snippet=entry.summary.$t}else{var rdp_get_snippet="";}};rdp_get_snippet=rdp_get_snippet.replace(/<[^>]*>/g,"");if(rdp_get_snippet.length<rdp_snippet_length){var rdp_snippet=rdp_get_snippet}else{rdp_get_snippet=rdp_get_snippet.substring(0,rdp_snippet_length);var space=rdp_get_snippet.lastIndexOf(" ");rdp_snippet=rdp_get_snippet.substring(0,space)+"&#133;";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rdp_commentsNum=entry.thr$total.$t+' '+rdp_comment}else{rdp_commentsNum=rdp_disable};if(entry.link[j].rel=='alternate'){var rdp_posturl=entry.link[j].href;if(y!=-1){rdp_posturl=rdp_posturl+'?m=0'}var rdp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rdp_thumb=entry.media$thumbnail.url}else{rdp_thumb="https://lh5.googleusercontent.com/-hxY0rTdcuyM/UfUyPpaoBKI/AAAAAAAACsQ/vFtqfUwj074/s72-no/no-image.PNG"}}};document.write('<li>');document.write('<img alt="'+rdp_posttitle+'" title="'+rdp_posttitle+'" src="'+rdp_thumb+'"/>');document.write('<div><a href="'+rdp_posturl+'" rel="nofollow" alt="'+rdp_posttitle+'" title="'+rdp_posttitle+'">'+rdp_posttitle+'</a></div>');if(rdp_info=='yes'){document.write('<span>'+rdp_postdate.substring(8,10)+'/'+rdp_postdate.substring(5,7)+'/'+rdp_postdate.substring(0,4)+' - '+rdp_commentsNum)+'</span>'}document.write('<div style="clear:both"></div></li>')}};getvalue();for(var i=0;i<rdp_numposts;i++){document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index='+rdp_current[i]+'&max-results=1&callback=random_posts\"><\/script>')};
</script>
</ul>

Catatan !

Untuk menyesuaikan berapa jumlah postingan yang tampil pada widget random post ini, silahkan ubah angka 5 pada kode yang berwarna biru diatas.

Kemudian, kode diatas berungsi menampilkan semua postingan blog dari semua label anda, tapi jika anda hanya ingin menampilkan postingan dengan label tertentu, silahkan ubah dua kode yang berwara merah diatas dengan \"/feeds/posts/default/-/Label? , ubah tulisan Label dengan nama label anda, contoh, nama label anda adalah Wisata, maka penampakannya seperti berikut:
\"/feeds/posts/default/-/Wisata?

Dan yang perlu diperhatikan lagi, jika nama label anda terdiri dari dua suku kata atau lebih, maka harus di tambahkan kode %20 sebagai pemisah kata untuk setiap dari nama label anda yang suku katanya berjumlah dua atau lebih. Contoh, nama label anda Wisata Alam, maka penampakannya seperti berikut:
\"/feeds/posts/default/-/Wisata%20Alam?

Atau, jika nama label anda terdiri dari tiga suku kata, contoh, nama label anda Wisata Alam Liar, maka penampakannya seperti berikut:
\"/feeds/posts/default/-/Wisata%20Alam%20Liar?

Dan begitu seterusnya, jadi intinya kode %20 fungsinya seperti spasi

4. Jika sudah, skarang silahkan save dan lihat hasilnya

Untuk DEMO nya silahkan lihat widget berjudul Artikel Lainnya pada sidebar sebelah kanan di blog ini.

Ok, sekian dulu postingan kali ini tentang Cara Membuat Widget Random Post Dengan Thumbnail  dan SEO Friendly, semoga bermanfaat dan terimakasih.
Heriyanto .S.M -
Sharehovel Updated at : 08.51

20 comments

mantaff kang, tapi saya lebih suka cara yg sederhana yaitu di feeds di tata letak

Punyaku masih belum ada gambarnya, tapi kayaknya saya juga mau coba nih :), menarik....:)

iya mbak, selera orang kan beda2 hehe :D

ok, silahkan dicoba kanda semoga bermanfaat :D

Wah keren nih widget random post yang ini, apalagi bisa dikelompokkan menurut label. Nanti saya coba terapkan diblog.

iya mas, silahkan diterapkan. :D

agak rumit juga ya mas pasang widget ini. tapi keren juga ya kalau link posting bisa berubah-ubah getu :)

hehe iya mbak, jadi ada kemungkinan postingan-postingan lama bisa dibaca kembali oleh pengunjung :D

kodenya terlalu banyak yaa.. pake punya blogger pun cukup meski bukan random, mungkin bisa pake popular post

wah klo popular post beda lagi ceritanya sob. Kodenya emang panjang, saya gak tau spa pembuat asli dari kode ini, cuma saya tambahain sedikit alt tag dan title pada javascriptnya, biar lebih SEO friendly dan gak terdeteksi error di chkme.

kalo kodenya kepanjangan kan bisa disingkat, upload di google drive gitu

Waahhh rame gila
Nyimaak ahh :D

hehe asal jangan gila rame-rame gan hoho.
silahkan disimak gan, kalau bermanfaat :D

terima kasih sangat berguna bagi saya karena Blog saya blog Jualan Visit ya www.rositashop.com

Sama-sama mbak Sita :D

Biar pun kodenya banyak, tapi gak ribet, tinggal tambah widget dah beres.

siip gan, dah tak pasang di blog ku. thx

Silahkan berikan komentar, kritik atau saran anda