Cara Menciptakan Random Post Dengan Gambar

Sebelum nya kemaren aku share Tutorial Tentang Cara Membuat Random Post Tanpa Gambar atau Cara Memasang Random Post Tanpa Gambar, kali ini aku akan share cara menciptakan random post dengan gambar nya.

Sudah aku terperinci kan pengertian random post pada artikel sebelum nya, bahawa Random Post yakni widget yang berisi bermacam macam artikel yang kita posting di blog dengan menampilkan secara acak dengan otomatis, ,cara menciptakan nya juga sangat mudah, sama dengan menciptakan random post yang tanpa gambar, lebih yummy nya silahkan ikuti Tutorial dari aku di bawah ini!

1.Copy arahan script yang ada 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;

var numofpost=5;

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>

*silahkan ganti atau sesuai kan nomor pada goresan pena warna hijau itu, untuk memilih jumlah artikel yang akan di tampilkan*

2.Buka Dasbor Blog

3.Pilih Tata Letak

4.Klik Add Gatget

5.Pilih HTML/Java Script

6.Pastekan script yang tadi agan copy

7.Klik Simpan  

Sekian Tutorial dari aku Tentang Cara Membuat Random Post Dengan Gambar

 atau Cara Memasang Random Post Dengan Gambar

Share this post