Cara Menampilkan Random Posts di Blogspot - cara blogging

Breaking

Tuesday, April 1, 2014

Cara Menampilkan Random Posts di Blogspot

Widget Random Posts Blogspot
Cara membuat, memunculkan, atau menampilkan widget Random Posts di blog

RANDOM
Posts adalah daftar posting yang ditampilkan otomatis "secara acak" atau muncul secara bergantian.

Kata para pakar SEO, Random Post itu bagus buat SEO Blog dan disukasi user.

Lihat DEMO. Klik salah satu posting di sana dan lihat di sidebar bagian bawah.

Cara membuat Random Post seperti demo tersebut ada di Tips Nomor #4 di bawah.

FUNGSI RANDOM POSTS
Random post berfungsi sebagai navigasi dan internal links. Dengan adanya Widget Random Posts --selain Related Posts dan Recent Posts, user atau pengunjung blog akan lebih mudah menjelajahi konten blog kita.

Mereka pun bisa berlama-lama tuh buka dan baca blog kita, bagus buat Page Rank!
Random Posts is a widget allow your visitors discover your old posts easily each time they refresh your blog on Blogger. Random Post adalah widget yang memudahkan pengunjung Anda membuka posting lama tiap kali mereka refresh blog Anda di blogger. Gitu katanya....

Cara Membuat Widget Random Posts #1

Cara membuat widget random post seperti seperti yang CB pakai ini gampang banget:
1. Buka Blogger Item 
2. Silakan pilih model.
3. Lakukan settingan dikit, banyak pilihannya.
4. Ambil (Copy) kodenya (Generate Code)
5. Paste di Layout > Add Gadget > JavaScript/HTML
6. Save!

Jadi deh tuh... widgets random post Anda sudah muncul!

Kode HMTL Random Posts Daftar Judul #2

Untuk membuat random posts berupa daftar judul saja, tanpa thumbnail, kita bisa gunakan kode HTML berikut ini. Caranya, tinggal ke Layout > Add Gagdget, lalu copas kode berikut ini. Jangan lupa ubah contohblognih dengan nama blog Anda.

<script type="text/javascript">
var randarray = new Array();var l=0;var flag;var numofpost=10;function randomposts(json){var total =parseInt(json.feed.openSearch$totalResults.$t,10);for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>'); for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];for(k=0; k < entry.link.length;k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";document.write(item);}}}document.write('</ul>');}</script> <script src="http://www.contohblognih.blogspot.com/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>

Cara Membuat Widget Random Posts #3 

Alternatif lain membuat random pots (lihat Demo) adalah sebagai berikut:
1. Tambahkan kode berikut sebelum kode ]]></b:skin>


random-posts img {
float:left;
margin-right:10px;
border:1px solid #999;
background:#FFF;
width:36px;
height:36px;
padding:3px
}

2. Save Template! Kembali ke Dashboard.
3. Klik "Layout" > "Add Gadget" > Pilih "HTML/Javascript" dan masukkan kode berikut ini:


<ul id='random-posts'>
<script type='text/javaScript'>
var rdp_numposts=5;
var rdp_snippet_length=150;
var rdp_info='yes';
var rdp_comment='komentar';
var rdp_disable='Comments Off';
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/AVvXsEjwjyzPpUQ4jJwuyL5atCknXvRy5Yz5PBK3ONq3pHFjvTgEZhtB9Am3npyNjh5KXrEHJbAnfNTuaDqK-MBMLX6qggEr8x9j0o2sLIZrRsE2msiA8hVpIoaouBJJSTfAqAQMu6etkvFL4_Ot/"}}};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>

4. Save!


Cara Membuat Widget Random Posts #4 (Recommended!)

Ini cara termudah, gak pake ribet. DEMO-nya di halaman dalam CB Blogger Lab, di sidebar paling bawah. Indah pula!
1. Layout > Add a Gadget > pilih HTML/Javascript
2. Copy + Paste kode berikut ini di dalam "Content". Judulnya widget bisa diisi "Random Posts", bisa juga yang lain, misalnya "Posting Menarik Lainnya".

<style>
#random-posts img{float:left;margin-right:10px;
width:65px;height:50px;background-color: #F5F5F5;padding: 3px;}
ul#random-posts {list-style-type: none;}
</style>
<ul id='random-posts'>
<script type='text/javaScript'>
var rdp_numposts=4;
var rdp_snippet_length=150;
var rdp_info='yes';
var rdp_comment='Comments';
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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgozGf1ScbCvhvIIm_kduJOpam13NwPQTdtEQSZ9XPk59-hgQFFtRJ1WszZuMcUvMYy1dWi3VgZUSD_ZlliB9Tac0lDsKNcOlVGOHJVwD-KAwH66fMHpdMtGI701FTjaDZyzhYVtXMqQxQ/s1600/no_thumb.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>

Kalau mau JUDUL doang tanpa Gambar dan  tanggal, gunakan kode ini:

<style>
#random-posts{border:1px solid #aaa;font-size:10pt;margin:auto;padding:0}
#random-posts li{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNj8OJ80GUhJTog1Wh8xxvMkpuRxFsKuySgjhDuu55HgZJGyU1MX_XtEwrHmuAwE4mFFWBTIItTb8U8AU1N7Tmc13bB4FLG2Z39bw6JZUJzK_jwJiZ1d5DPAa7priQSkSd3Zentdok5Tr1/s1600/sprites.png) no-repeat 0 -67px;border-bottom:1px solid #ccc;height:36px;line-height:1.5em;list-style-type:none;margin:0;overflow:hidden;padding:6px 10px 10px 3.5em !important}
#random-posts img{display:none}
#random-posts{background:#f6f6f6;background: -webkit-gradient(linear, 0% 40%, 0% 70%, from(#f9f9f9), to(#f1f1f1));background: -moz-linear-gradient(linear, 0% 40%, 0% 70%, from(#f9f9f9), to(#f1f1f1))},#random-posts
</style>
<div id='random-posts'>
<script type='text/javaScript'>
var rdp_numposts=7;var rdp_snippet_length=0;var rdp_info='no';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);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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaBSIGOVyumnOJq-l30kIybMICIwwkAQSBnrc3psfIcc5UpG_Utp39KeBslAK54py8HzPk4NnG_BKvIlcNZtuiDmSDw7wH4yYHaV1wQbbKx3BJCUxqmezNVFg7uh4dVFT1daNmKCynBVI/s1600/default.jpg"}}};document.write('<li>');document.write('<img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/>');document.write('<div><a href="'+rdp_posturl+'" title="'+rdp_posttitle+'">'+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></div>

CARA LAIN

Cara lainnya? Banyak banget ya....! Memang cukup banyak blogger yang berbagi tips sekaligus menyediakan kode Random Posts untuk blog Anda.

Selain yang di atas, ini dia yang lainnya:
  1. Help Blogger
  2. Masih Help Blogger
  3. Blogspot Tutorial
  4. Yang horisontal ada di Bloggerneur
  5. NetOops Blog
Nah itu dia 8 macam cara Cara Membuat Widget Random Posts di Blogspot ... Silakan dipilih dipilihhhh......! Good Luck!

No comments:

Post a Comment

Pages