InstaForex

Minggu, 06 Mei 2012

Random Post dengan thumbnail loading ringan

Random Post dengan thumbnail loading ringan 
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.

Tapi terkadang blogger malas menambahkan widget ini dengan alasan widget random post rata rata loadingnya berat.

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.

Tidak percaya?.....,periksa 2 URL image dari gambar yang sama berikut,klik untuk melihat dan bedakan ukurannya.

Ukuran img random post
http://4.bp.blogspot.com/-_PU7V_6X3aU/TpCSuze1-RI/AAAAAAAAANk/IP9hUmIYSRo/s72-c/Nokia+N8+Harga+dan+Spesifikasi.jpg

Ukuran img didalam postingan
http://4.bp.blogspot.com/-_PU7V_6X3aU/TpCSuze1-RI/AAAAAAAAANk/IP9hUmIYSRo/s600-c/Nokia+N8+Harga+dan+Spesifikasi.jpg

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="http://lh3.ggpht.com/--Z8SVBQZ4X8/TdDxPVMl_sI/AAAAAAAAAAA/jhAgjCpZtRQ/no-image.png"}}};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
Share this post
  • Share to Facebook
  • Share to Twitter
  • Share to Google+
  • Share to Stumble Upon
  • Share to Evernote
  • Share to Blogger
  • Share to Email
  • Share to Yahoo Messenger
  • More...

0 komentar

:) :-) :)) =)) :( :-( :(( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ :-$ (b) (f) x-) (k) (h) (c) cheer

 
© 2011 INFO BISNIS ONLINE
Designed by Digimart
Posts RSSComments RSS
Back to top