Random Post dengan thumbnail loading ringan

Memasang widget random post dibutuhkan agar visitor dapat melihat artikel lainnya dari blog kita.Random post sangat berbeda,karena sanggup memunculkan postingan sebelumnya yang sudah terkubur diantara postingan lain secara bergantian tiap kali refresh.Sebagai fitur tambahan navigasi,tiada salahnya jika random post ini ditambahkan kedalam widget blog kita agar pageview semakin tinggi dan merata.
Jika anda tertarik,random post widget script hasil saya browsing berikut memiliki loading yang relatif lebih cepat.Hal ini beralasan karena thumbnail yang ditampilkan merupakan URL image dari blogger dalam versi ukuran pict  kecil yang disesuaikan.
Biasanya sebuah widget yang menampilkan thumbnail,biasanya menghadirkan image thumbnail yang memiliki  ukuran file sama denga ukuran  image postingan.Jadi image tersebut hanya dimanipulasi ukuran panjang kali lebarnya dengan CSS/HTML saja sehingga hanya tampak menjadi kecil ,sedangkan ukuran file tetap sama besarnya.
Namun yang ini tidak hanya ukuran filenya pun benar benar menjadi kecil,sehingga loadingnya menjadi ringan.
Cara memasang Random Post dengan thumbnail loading ringan

Masuk kedalam Rancangan, Add new widget ,pilih HTML/javascript dan copas code berikut;
<style>
<!--
#random-posts img{float:left;margin-right:10px;border:1px solid #999;background:#FFF;width:36px;height:36px;padding:3px}
-->
</style>
<ul id='random-posts'>
<script type='text/javaScript'>
var rdp_numposts=5;
var rdp_snippet_length=60;
var rdp_info='yes';
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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWjyzKhyphenhyphen7fUCW3TFxKKyCFVcZSkStcri71BG6GhUcbzVBLJ2TUU63zO71GuM4UboOiwR0gAjqOKsTwT2GtEC0CvvkG7uywNt6SbmsTk_IsWMbNiVHzAyE9Mq5ChrCVdCQL-GsUPO0AlrEP/"}}};document.write('<li>');document.write('<img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/>');document.write('<div><a href="'+rdp_posturl+'" rel="nofollow" title="'+rdp_snippet+'">'+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>
Simpan dan lihat hasilnya!

Setting sesuai keinginan
Untuk merubah ukuran IMG,edit style width:36px;height:36px
Untuk mengatur jumlah judul artikel yang ditampilkan,ubah jumlah default yaitu 5
Untuk mengatur jumlah karakter cuplikan/snippet,ubah jumlah default yaitu 60

Ditulis Oleh : Unknown ~ Hidup Terasa Indah Bila Saling Berbagi

Sobat sedang membaca artikel tentang Random Post dengan thumbnail loading ringan . Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya, TERIMA KASIH Karena sudah bersedia Memberikan Komentar untuk Blog ini... !!! <a href=" http://6laskar-pelangi.blogspot.com/2012/06/random-post-dengan-thumbnail-loading.html " target="_blank"> Random Post dengan thumbnail loading ringan </a>

:: Effendi Dalimunthe ! ::

Baca Juga Artikel Terkait Lainnya

Posted in: LiputanBlogger