Widget Rendom Post Hanya Dengan Gambar

Cara Membuat Widget Rendom Post Hanya Dengan Gambar – Widget Rendom Pos adalah widget yang memberikan informasi kepada pengunjung mengenai beberapa artikel di blog tersebut secara acak atau rendom. Kali ini saya akan berbagi widget rendom post hanya dengan Tubnail atau hanya dengan gambar saja, namun dengan efek Rendom yang sangat menarik untuk sobat coba pasang di blog sobat.

Fungsi dari widget ini sama dengan widget Populer pos atau Widget Artikel terbaru, hanya saja widget ini memiliki keunikan tersendiri yaitu dapat menampilkan daftar artikel lain secara acak. Widget ini akan terlihat elegan. Bagi sobat yang tertarik untuk mencobanya atau bagi sobat yang tertarik untuk mempelajari nya silahkan simak cara membuatnya berikut ini.

1. buka Blog Sobat > masuk menu “ Tata Letak” > Tambah Widget baru  > HTML/Java Script > salin kode di bawah ini dna letakkan di dalam widget yang tadi subat buat.

<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/AVvXsEhz0yhzcIx7UHe3x8V9u6JGIrSYaC4y8QVhy4TjMBc86NKHRTMF9gWtB5_vsuc0IdgbNQqNOBgXVJEesqcOF2Qdgc_qvkTmwpXIAPh7KobsmKPRYAx5BsrXsnPDyNz6LIX0Miw91ziIQhd5/"}}};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>

NB : silahkan sobat cari kode var rdp_numposts=9; untuk menampilkan jumlah post yang nantinya akan tampil.
2. simpan Setelan dan Lihat hasilnya. Saya yakin jika sobat mengikuti tutorial di atas dengan benar maka rendom post dengan gambar saja sudah dapat tampil di blog sobat.

Demikianlah tutorial mengenai Cara Membuat Widget Rendom Post Hanya Dengan Gambar, yang harus di ketahui. jika sobat ada masalah atau sudah berhasil jangan lupa untuk mengisi Kotak komentar di bawah ini. Semoga artikel ini dapat menjadi ilmu yang bermanfaat.