Membuat Widget Random Post Hanya Gambar

Widget random adalah sebuah widget yang menampilkan postingan-postingan kita sebelumnya dengan bentuk acak. Artinya, postingan-postingan yang lama walau jarang dikunjungi pun akan mendapat kesempatan yang sama sebagaimana postingan yang banyak pengunjungnya. Widget ini sangat penting, untuk memberikan suasana baru atau informasi yang menarik pada pengunjung blog kita. 

Kemudian, sahabat pernah mendapati sebuah blog dengan postingan gambar saja? Oleh karenanya, pada kesempatan ini, Ngonline06 akan berbagi widget random yang berbentuk grid atau gambar saja.

Kode Random Post dengan Gambar Saja

Yaitu, pesan ini akan muncul saat pengunjung blog sahabat ingin mengunjunginya. Caranya sahabat langsung meluncur ke LAYOUT (Tata Letak) blog sahabat, dan tambahlah kode html. Masukkan saja kode di bawah ini pada html tersebut. Maka keajaiban pun terjadi. Sahabat sekarang memiliki random post dengan gambar yang cantik.

<style type='text/css'>
#random-posts{width:100%;background:none;}
#random-posts ul {margin: 0 auto!important;  padding: 0 !important;text-align:center  }
#random-posts ul li {background:none ;list-style-type: none;margin:0;padding:0 !important}
#random-posts li{float:left;list-style:none;border:none;width:90px;height:90px;overflow:hidden;margin-right:5px !important;margin-top:5px !important}
#random-posts img{float:left;width:100%;height:100%;max-width:none;max-height:none;min-width:0;min-height:0;;border:none;outline:0;position:static;transition:all .8s ease-out;}
#random-posts img:hover {-webkit-transform:scale(1.3);-ms-transform:scale(1.3);-o-transform:scale(1.3);transform:scale(1.3);}
</style>
    <div id="random-posts">
    <ul>
    <script type='text/javaScript'>
    var rdp_numposts=9;
    var rdp_snippet_length=0;
    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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzx17pkm538Cot8AKqQM5usqnODreRRF63sauUYogBVE9ZiNFO148he2c5ty9U7p8GcGrrRqCVKK3cszk6MwSAmB6xIR-JFnLhFYLqdI1vNZCieajGWHrcz5WHItiUBD_G5EHn9ioKvJKx/"}}};document.write('<li>');document.write('<a href="'+rdp_posturl+'" rel="nofollow" title="'+rdp_posttitle+'"><img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'" title="'+rdp_posttitle+'" height="90" width="90"/></a>');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>
    </div>

Keterangan: var rdp_numpost artinya jumlah postingan yang hendak ditampilkan. Jika ada yang mendapat kesulitan dengan tutorial di atas, silahkan corat-coret di kotak komentar di bawah ya. Salam sukses dari Ngonline06.