How To Add Random Post With Thumbnail !!

Hi Readers !!
Today I am going to show you another trick in which you could add a Widget which will show random thumbnail of your posts. This thumbnails are arranged according to your labels. The demo you can see is at the bottom of my blog. This is one of the easiest widget to set up.
As usual just follow this steps. :


1. Log in to your blogger account
2. Go to Design --> Page Elements --> Add Gadget --> Choose Html/java script
3. Then, add the code below

<style text-type="CSS">
img.label_thumb {
float:left;
padding:3px;
background:#CCC;
border:1px solid #A4A4A4;
width:100px;
height:75px;
margin-right:10px;
margin-top:10px }

img.label_thumb:hover {
opacity:0.8;
filter:alpha(opacity=80);
-moz-opacity:0.80;
-khtml-opacity:0.8 }
</style>

<script type='text/javascript'> 
//<![CDATA[ 
function labelthumbs(json){document.write('<div>');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;} 
if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}} 
var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error) 
{s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl=d;} 
else thumburl='';} 
document.write('<a href="'+posturl+'" title="'+posttitle+'"><img class="label_thumb" src="'+thumburl+'"/></a>'); 
if(i!=(numposts-1)) 
document.write('');} 
document.write('</div>');} 
//]]> 
</script>

<script type='text/javascript'>var numposts = 4;</script> 
<script type="text/javascript" src="/feeds/posts/default/-/Blogging+Tips?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

=> The red code is the number of the post that you want to show
=> The Blue code is the name of the blog label (The alphabet must be same and if there is more than 1 word in the label then add + sign between the two instead of space.)


Cheers 

Posted in: Blogging