Cara Membuat Random Posts di Sidebar Blog

Baca Juga

Cara Membuat Widget Random Posts Fast Loading di Sidebar Blog Blogspot.

RANDOM posts adalah widget di sedebar blog blogspot berupa daftar judul posting (tulisan) yang tampil secara acak (random).

Fungsi widget random post adalah sebagai navigasi blog dan internal link yang dapat meningkatkan jumlah halaman yang dibuka (pageviews), juga memudahkan pengunjung menemukan atau melihat daftar judul lainnya.

Contoh widget random post dengan gambar thumbnail ada di sidebar blog  ini.

Kita juga bisa memasang Random Post yang berupa judul saja, tanpa gambar.

Cara Memasang Widget Random Posts Daftar Judul Saja:

1. "Layout" > "Add Gadget" > pilih "JavaScript/HTML"
2. Isi judul widget dengan "Random Posts"
3. Copy & Paste kode berikut ini di kolom "Content"

<div id='random-post-container'>Memuat...</div>
<script>
//<![CDATA[
// Feed configuration
var homePage = 'http://blogromeltea.blogspot.com',
maxResults = 5,
containerId = 'random-post-container';
// Function to generate random number limited from `min` to `max`
// Used to create a valid and safe random feed `start-index`
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
// Function to shuffle arrays
// Used to randomize order of the generated JSON feed
function shuffleArray(arr) {
var i = arr.length, j, temp;
if (i === 0) return false;
while (--i) {
j = Math.floor(Math.random() * (i + 1));
temp = arr[i];
arr[i] = arr[j];
arr[j] = temp;
}
return arr;
}
// Get a random start index
function createRandomPostsStartIndex(json) {
var startIndex = getRandomInt(1, (json.feed.openSearch$totalResults.$t - maxResults));
// console.log('Get the post feed start from ' + startIndex + ' until ' + (startIndex + maxResults));
document.write('<scr' + 'ipt src="' + homePage + '/feeds/posts/summary?alt=json-in-script&orderby=updated&start-index=' + startIndex + '&max-results=' + maxResults + '&callback=randomPosts"></scr' + 'ipt>');
}
// Widget's main function
function randomPosts(json) {
var link, ct = document.getElementById(containerId),
entry = shuffleArray(json.feed.entry),
skeleton = "<ul>";
for (var i = 0, len = entry.length; i < len; i++) {
for (var j = 0, jen = entry[i].link.length; j < jen; j++) {
link = (entry[i].link[j].rel == "alternate") ? entry[i].link[j].href : '#';
}
skeleton += '<li><a href="' + link + '">' + entry[i].title.$t + '</a></li>';
}
ct.innerHTML = skeleton + '</ul>';
}
document.write('<scr' + 'ipt src="' + homePage + '/feeds/posts/summary?alt=json-in-script&max-results=0&callback=createRandomPostsStartIndex"></scr' + 'ipt>');
//]]>
</script>

4. Ganti nama blognya dengan nama blog Anda.

5. Save!

Cara Memasang Widget Random Posts: Judul & Gambar

1. "Layout" > "Add Gadget" > pilih "JavaScript/HTML"
2. Isi judul widget dengan "Random Posts" (bisa pula nama lain)
3. Copy & Paste kode berikut ini di kolom "Content"

<style>
<!--
#random-posts img{float:left;margin-right:10px;border:1px solid #999;background:#FFF;width:40px;height:40px;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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl_Nsnkd1LxWcyNWDz3tu5EejJ5t8nIwvGTru3XPWT3F2ThUPrE8Lmiqz2YYtQaqxn0QtmHMK-lj3rRv1Swm4-rcmj5Ak9CDg0Qjb7QVR9yCJCGJyveuRQ3nr3Akbyz3xJ4DSJyUS61HIB/"}}};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. Jumlah posting yang mau ditampilkan bisa diubah di kode numposts=5 misalnya menjadi 7 atau 10, atau berapa saja. Sebaiknya 5 saja agar Fast Loading.

5. Save!

Kini widget Random Posts sudah muncul di Sidebar Blog Anda.

Sumber