make recent posts for blogger (with thumbnail)

In blogger ,recen post widget is ready to use . But I have another widget script and I want to introduce it to you and explain how it work . This script is used many times in templates I designed and I think if I show it here and make a little explanation , you can solve some problems occurred when using my template .



here is the complete code . Just copy and paste this code to widget content .

<style type="text/css">
.featured {
background: #FFFFFF;
float: left;
width: 250px;
margin: 0px 10px 20px 0px;
padding: 10px 10px 10px 10px;
border: 1px dotted #94B1DF;

}

.featured img {
border: none;
margin: 0px 10px 0px 0px;
float: left;
width:70px;
height:70px;
}

#content {
width: 600px;
margin: 0px auto 0px;
padding: 10px 0px 0px 0px;
line-height: 18px;
}

#content h3 {
background: #FFFFFF url(http://farm3.static.flickr.com/2656/3807676662_397525ba0b_o.gif);
color: #FFFFFF;
font-size: 12px;
font-family: Arial, Tahoma, Verdana;
font-weight: bold;
text-align: center;
text-transform: uppercase;
margin: 0px 0px 10px 0px;
padding: 7px 0px 5px 0px;
}

.botline {
border-bottom: 1px dotted rgb(148, 177, 223);
padding: 0px 0px 10px;
margin-bottom: 10px;
clear: both;
}
</style>

<script language="JavaScript">
imgr = new Array();

imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";

showRandomImg = true;

aBold = true;

summaryPost = 70;
summaryTitle = 25;

numposts = 3;
home_page = "http://simplexdesign.blogspot.com/";

label = "blogger";
tLabel = "blogger";
Title = "blogger";


function removeHtmlTag(strx,chop){
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
s = s.join("");
s = s.substring(0,chop-1);
return s;
}

function showrecentposts(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();

for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var pcm;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}

for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
pcm = entry.link[k].title.split(" ")[0];
break;
}
}

if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";

postdate = entry.published.$t;

if(j>imgr.length-1) j=0;
img[i] = imgr[j];

s = postcontent ; 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!="")) img[i] = d;

cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


var month = [1,2,3,4,5,6,7,8,9,10,11,12];
var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];

var day = postdate.split("-")[2].substring(0,2);
var m = postdate.split("-")[1];
var y = postdate.split("-")[0];

for(var u2=0;u2<month.length;u2++){
if(parseInt(m)==month[u2]) {
m = month2[u2] ; break;
}
}

var daystr = (showPostDate) ? '<i><font color="'+acolor+'"> - ('+day+ ' ' + m + ' ' + y + ')</font></i>' : "";

posttitle = (aBold) ? "<b>"+posttitle+"</b>" : posttitle;

var trtd = '<a href="'+posturl+'"><img src="'+img[i]+'"></a><a href="'+posturl+'"><b>'+removeHtmlTag(posttitle,summaryTitle)+'...</b></a><br/>'+removeHtmlTag(postcontent,summaryPost)+'...<div class="botline"></div>';

document.write(trtd);

j++;
}

}

document.write('<div class="featured">');
document.write('<h3>'+Title+'</h3>');
document.write("<script src=\""+home_page+"feeds/posts/default/-/"+label+"?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
document.write('<b><a href="'+home_page+'search/label/'+label+'?max-results=10">More '+tLabel+'</a></b>');
document.write('</div>');

</script>

Explanation

When it start , this script will get the feed of blog at address which assigned in variable home_page and get the posts under with labels assigned in variable label
The number of recent posts will be showed is assigned in variable numposts
The number of character in post title will be showed is assigned in variable summaryTitle
The number of character in post summary will be showed is assigned in variable summaryPost