Recent post Blogger Widget with Thumbnails

Wednesday, December 08, 2010

This post explains how to add Recent Posts widget in Blogger with image thumbnails:

Features:
Thumbails to Recent Posts
Comment Count


So, let's see how to install this cool widget in your blog..

1. Sign into Blogger dashboard
2. Go to Layout » Add a gadget » html/javascript


3. Just copy and paste this code there


<script language="JavaScript">

imgr = new Array();


imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;

boxwidth = 298;

cellspacing = 8;

borderColor = "#ffffff";

bgTD = "#000000";

thumbwidth = 40;

thumbheight = 40;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = false;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 5;

home_page = "http://schemar-mag.blogspot.com/";

</script>

<script src="http://myblogtalk.com/bloggertemplates/js/recentposts_thumbnail.js" type="text/javascript"></script>


Explanation:


(Edit the values to fit your blog)

boxwidth - Width of the widget
cellspacing - Space between cells (default one is good)

borderColor - Border color (add the background color of your template to perfectly blend it in the template)
thumbwidth & thumbheight - Width and Height of the thumbnail (default are good)
fntsize - Font size of the title
acolor - Color of the title
aBold - you want bold titles? (true or false)
numposts - How many posts you want to show?
home_page : http://schemar-mag.blogspot.com/ (change this to your blog url)
This script is currently hosted on the blogger tricks ( http://myblogtalk.com/bloggertemplates/js/recentposts_thumbnail.js ).
But, it is strongly Recommended to download the script and upload to your own hosting (google for free javascripts hosts) and replace that url with yours. If you don't know about his, just let it go

4. Save the Changes.
Voila! you're done
Note : Make sure you selected YES in Settings » Site Feed » Full » Allow Blog Feeds

You can follow us on Twitter or Join us on Facebook to receive all updates . . .




Share your views...

0 Respones to "Recent post Blogger Widget with Thumbnails"

Post a Comment

 

Connect with us

Followers

© 2010 - 2017 theinfoW.com All Rights Reserved | Contact Us | About Us | Privacy Policy | Terms of Use |