Cara mudah membuat Random Post

Cara Memasang Random Post Beserta Thumbnail

Sama halnya dengan Popular Post yang bisa dipasangi gambar, Random post yang akan saya bagikan kali ini juga sudah saya modifikasi dengan gambar sehingga akan mempercantik tampilannya. Tidak hanya itu, pada random post saya kali ini juga ada ringkasan postinganya yang dapat membuat pengunjung tertarik untuk membacanya.

Buat anda yang tertarik memasang widget random post ini, silahkan ikuti langkah-langkah sederhana di bawah ini:
Cara mudah membuat Random Post

1. Login dengan akun blog saudara

2. Masuk ke menu TATA LETAK

3. Klik tambah gadget --> pilih HTML/Javascript

4. Masukan script di bawah ini:

<style>
.rp-post-link {
font-weight: bold !important;
font-size: 12px !important;
}
.rp-summary {
margin-bottom: 5px !important;
border-bottom: 1px dotted #686868;
font-size: 12px !important;
line-height: 20px !important;
word-wrap: break-word !important;
}
.rp-thumbnail {
margin: 5px 5px 2px 0px !important;
float: left !important;
width:60px;height:60px;
}
.rp-pubdate {
font-style: italic !important;
margin-bottom: 3px !important;
}
</style>
<script type="text/javascript">
var randarray = new Array();
var l=0;
var flag;
var lengthsummary = 120; //Jumlah karakter postingan yang ditampilkan
var numofpost=5; //Jumlah postingan yang ditampilkan
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('<div>');
for(n in randarray){
var p=randarray[n];
var entry=json.feed.entry[p-1];
var item ="";
var posttitle = entry.title.$t || "[Untitled]";
"[Untitled]"
for(k=entry.link.length -1; k >= 0 ; k--){
if(entry.link[k].rel=='alternate'){
item +="<a class='rp-post-link' href='" + entry.link[k].href + "'>" + posttitle + "</a>";
break;
}
}
item += "<br"
item += "/>"

if('media$thumbnail' in entry)item += "<img class='rp-thumbnail' src='" + entry.media$thumbnail.url + "'>"
var summary = "";
if ("content" in entry) {
summary = entry.content.$t;
}
else if ("summary" in entry) {
summary = entry.summary.$t;
}
var re = /<\S[^>]*>/g;
summary = summary.replace(re, "");
item += "<p class='rp-summary'>" + summary.substring(0,lengthsummary) + " ...</p>";
document.write(item);
}
document.write('</div>');
}
</script>
<script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript">
</script>

Keterangan kode di atas:

Kode warna Hijau: Mengatur lebar dan tinggi gambar/thumbnail pada random post nanti.
Kode warna Merah: Jumlah Postingan yang ingin ditampilkan.
Kode warna Biru: Jumlah karakter/huruf pada ringkasan yang ingin ditampilkan.

5. Klik simpan dan lihat hasilnya.

Demikianlah artikel mengenai Cara mudah membuat Random Post . Semoga bermanfaat.