Cara Membuat Random Post Pada Blog

Cara membuat random post pada blog sangatlah mudah. Sebelum membuat random post, ada baiknya kita mengetahui fungsi random post. Random post berfungsi untuk memunculkan tulisan lama supaya dapat dibaca kembali oleh pengunjung. Pengunjung akan berlama di blog kamu dengan membaca artikel lama yang bermanfaat.

Ada dua cara membuat random post untuk blog. Pertama, cara membuat random post dengan gambar. Bagi kamu yang suka menampilkan gambar dan tulisan pada halaman utama, cara ini merupakan cara yang cocok bagi kamu.

Kedua, random post tanpa gambar. Ada yang tidak menyukai gambar pada halaman utama, mungkin bisa membuat pembaca tidak fokus dengan judul. Sehingga cara kedua memberikan solusi dengan hanya menampilkan judul dari sebuah artikel.

Duacara yang akan di paparkan merupakan cara mudah membuat widget random post bergambar dan random post tanpa gambar untuk blogger. Cara ini merupakan cara membuat widget random post yang cepat dan ringan. Saya sudah mengaplikasikan kedua cara tersebut. Yuk kita mulai paparan cara membuat random post dan segera langsung terapkan dalam blog kamu.

Cara Membuat Random Post dengan Gambar

Random post kotak

Langkah-langkahnya sebagai berikut:
1. Masukke akun blogger.com
2. Buka dashbor
3. Tata letak
4. Widget atau tambahkan gadget

Pilih HTML/ Java Scrip

Tulis Judul: Random Post

5. Masukkan kode berikut pada konten

<style>#random-posts img{border-radius: 0px;float:left;margin-right:5px;width:75px;height:75px;background-color: #FFFFF;padding: 3px;transition: all 0.2s linear 0s;}#random-posts img:hover{opacity: 0.6;}ul#random-posts {list-style-type: none;padding: 0px;}#random-posts a {font-size: 13px;text-transform:uppercase; padding: 0px auto 5px;}#random-posts a:hover {text-decoration: none;}.rp-snippet {font-size: 11px;background: none; padding: 5px; margin-right: 8px;}#random-posts span {}#random-posts li {margin-bottom: 10px;border-bottom: 1px solid #EEEEEE; padding: 4px;}</style><ul id='random-posts'><script type='text/javaScript'>var rdp_numposts=4;var rdp_snippet_length=120;var rdp_info='no';var rdp_comment='comment';var rdp_disable='Comments Disabled';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){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;var rdp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rdp_thumb=entry.media$thumbnail.url}else{rdp_thumb="http://1.bp.blogspot.com/-PPTJQCe-atQ/U4ca2QTr_5I/AAAAAAAAEEc/TRrKNK1fqQY/s1600/no-image-available.jpg"}}};document.write('<li>');document.write('<a href="'+rdp_posturl+'" rel="nofollow"><img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/></a>');document.write('<div><a href="'+rdp_posturl+'" rel="nofollow" title="'+rdp_snippet+'">'+rdp_posttitle+'</a></div>');if(rdp_info=='yes'){document.write('<span><div class="rp-info">'+rdp_postdate.substring(8,10)+'/'+rdp_postdate.substring(5,7)+'/'+rdp_postdate.substring(0,4)+' - '+rdp_commentsNum)+'</div></span>'};document.write('<div class="rp-snippet">'+rdp_snippet+'</div><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>

Pengaturan pada hal berikut sesuai  keinginan:

border-radius:50px = gambar akan berbentuk lingkaran

border-radius:0px = gambar akan berbentuk persegi empat
varrdp_numposts=4;   Jumlah post yang akan ditampilkan
varrdp_snippet_length=120; Jumlah kata post yang akan ditampilkan

6. Simpan

Random Post Tanpa Gambar

Langkah-langkah membuat random pos tanpa gambar

1. Masuk ke akun blogger.com
2. Buka dashbor
3. Tataletak
4. Widget atau tambahkan gadget
5. Masukkan kode berikut pada konten

<style>#random-posts img{border-radius: 0px;float:left;margin-right:5px;width:75px;height:75px;background-color: #FFFFF;padding: 3px;transition: all 0.2s linear 0s;}#random-posts img:hover{opacity: 0.6;}ul#random-posts {list-style-type: none;padding: 0px;}#random-posts a {font-size: 13px;text-transform:uppercase; padding: 0px auto 5px;}#random-posts a:hover {text-decoration: none;}.rp-snippet {font-size: 11px;background: none; padding: 5px; margin-right: 8px;}#random-posts span {}#random-posts li {margin-bottom: 10px;border-bottom: 1px solid #EEEEEE; padding: 4px;}</style><ul id='random-posts'><script type='text/javaScript'>var rdp_numposts=4;var rdp_snippet_length=120;var rdp_info='no';var rdp_comment='comment';var rdp_disable='Comments Disabled';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){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;var rdp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rdp_thumb=entry.media$thumbnail.url}else{rdp_thumb="http://1.bp.blogspot.com/-PPTJQCe-atQ/U4ca2QTr_5I/AAAAAAAAEEc/TRrKNK1fqQY/s1600/no-image-available.jpg"}}};document.write('<li>');document.write('<a href="'+rdp_posturl+'" rel="nofollow"><img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/></a>');document.write('<div><a href="'+rdp_posturl+'" rel="nofollow" title="'+rdp_snippet+'">'+rdp_posttitle+'</a></div>');if(rdp_info=='yes'){document.write('<span><div class="rp-info">'+rdp_postdate.substring(8,10)+'/'+rdp_postdate.substring(5,7)+'/'+rdp_postdate.substring(0,4)+' - '+rdp_commentsNum)+'</div></span>'};document.write('<div class="rp-snippet">'+rdp_snippet+'</div><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>

Ganti url www.asmirizani.com menjadi url blogkamu

6. Simpan

Lihat hasil kerjaanmu pada halaman utama blog. Random Post telah terpasang.


Random Post Bergerak

1. Masuk ke akun blogger(dot)com
2. Buka dashbor
3. Tata letak
4. Widget atau tambahkan gadget
5. Masukkan kode berikut pada widget

<style type="text/css">/*widget*/#rp_plus_img{overflow:hidden;border:solid 0px #ddd;padding:10px; background-color:none;line-height:1.6em;}#rp_plus_img ul{list-style-type:none;margin:0;padding:0;}#rp_plus_img li{border:0; margin:0; padding:0; list-style:none;}#rp_plus_img li{height:70px;padding:1px;list-style:none;}#rp_plus_img a{color:#ffffff}#rp_plus_img .news-title{display:block;font-weight:normal !important;margin-bottom:6px;font-size:15px;}#rp_plus_img .news-text{display:block;font-size:12px;font-weight:normal !important;color:#ffffff;text-align:justify;}#rp_plus_img img{float:left;margin-right:10px;padding:1px;border:solid 1px #282828;width:60px;height:60px;border-radius:3px;}</style><!-- start --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><script type="text/javascript" src="https://cdn.rawgit.com/Brando07/share/master/random-post-bergerak-seocips.js"></script><script type="text/javascript">var speed = 250;var pause = 3500;$(document).ready(function(){rpnewsticker();interval = setInterval(rpnewsticker, pause);});</script><ul id="rp_plus_img"><script style="text/javascript">var numposts = 6;var numchars = 0;</script><script src="http://www.asmirizani.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script></ul> <!-- /end -->

6. Simpan. Lihat hasil kerjaanmu. Random post bergerak sudah terpasang di blog kamu

Semoga artikel ini bermanfaat. Artikel ini dibuat sekadar untuk dokumentasi mengenai panduan blog. Saya telah mencoba langkah-langkah di atas pada blog saya. Setelah saya bisa mencobanya, saya akan menyimpan panduan blog tersebut pada laman ini. Beberapa Kode HTML di atas saya dapat dari blog para mastah.

Panduan blog di atas saya dapat dari hasil bacaan. Hasil bacaan tersebut saya pelajari.Setelah saya pelajari, saya terapkan dan modifikasi. Setelah saya terapkan,saya berbagi.

Sumber bacaan dan kode HTML

Arlinadzgn

Turorial89

Share on Google Plus

About Asmirizani

Lelaki biasa yang sedang belajar mengeja hidup. Membaca, menulis, dan belajar tiada henti ditemani secangkir kopi jahe,