Home » » Tips Menyisipkan Random Post Thumbnail pada blog

Tips Menyisipkan Random Post Thumbnail pada blog

Written By Topiktrend Chanel on Friday, April 12, 2013 | 3:08 PM



SEPUTAR BLOGGER, Menampilkan postingan secara acak atau lebih dikenal dengan random posrt menjadi alternatif para blogger untuk menampilkan kembali postingan yang telah lama, tampilan random post bisa berupa judul, summary atau lebih di kenal dengan ringkasan tulisan, cuplikan gambar (Thumbnails), tampilannya cukup menarik.

Dengan random post, pengunjung akan lebih mudah menemukan postingan-postingan yang dahulu, tak perlu lagi mengutak-atik arsib blog yang memakan waktu cukup lama dan sering bikin gerah lebih-lebih lagi jika jaringannya lelet, pusingnya mita ampyuun.

Langsung aja pada tipsnya :
  • Login ke blogger 
  • Pilih Layout/Tata letak lalu klik Tambah Gadget
  • Pilih HTML/Javascript
  • Paste Code Script berikut : 
<style>
.rp-post-link {
font-weight: bold !important;
font-size: 120% !important;
}
.rp-summary {
margin-top: 3px !important;
font-size: 100% !important;
line-height: 1.3em !important;
word-wrap: break-word !important;
}
.rp-thumbnail {
margin: 5px 5px 2px 0px !important;
float: left !important;
width:65px;height:65px;
}
.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 = 180;
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 += "/>"
var pubdate = new Date(entry.published.$t).toDateString();
item +="<span class='rp-pubdate'>Posted On " + pubdate +"</span>";
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>
  • Jangan keburu disimpan, perhatikan code berikut
width:65px;height:65px; = ukuran Thubnails
var lengthsummary = 180; = jumlah karakter cuplikan post
var numofpost=5; = Jumlah Post yang akan ditampilkan
  • Selesai, jangan lupa disimpan.
 
Share this article :

0 comments:

Post a Comment

Enter your email address:

Delivered by FeedBurner

Subscribe to Blogger Pohuwato by Email

 
Support : Your Link | Your Link | Your Link
Copyright © 2013. Blogger Pohuwato - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger