Recent posts with thumbnail for each labels

 SETUP - INSTALL:
1/ Activate Full Feed in Blogger. Go to Settings > Site Feed > Allow Blog Feeds > choose Full in dropdown menu. Select Full will syndicate the full content of your post. Reader can read all your post in feed without visit your site. If you don't do this step, Recent Post can not display right thumbnail of your post, and display random thumbnail.

2/ Go to Layout > Page Elements and Add a widget, then paste this code:


<script type="text/javascript">

imgr = new Array();

imgr[0] = "http://lh4.ggpht.com/_t2Z6nkGKLVc/SuHdAIyGJFI/AAAAAAAAAlw/ZddbcX27rVY/s128/windows_7_32bit_4gb_ram_2.png";

imgr[1] = "http://lh4.ggpht.com/_t2Z6nkGKLVc/SugcQki56yI/AAAAAAAAAn4/7VvpxuJwSJM/s128/firefox_addons_compatibility_check.png";

imgr[2] = "http://lh6.ggpht.com/_t2Z6nkGKLVc/Suuy2rgY22I/AAAAAAAAAoc/HoCgkM79ZPY/s128/TuneUp_Utilities_2010_main.png";

imgr[3] = "http://lh6.ggpht.com/_t2Z6nkGKLVc/SugB5dMgEZI/AAAAAAAAAnQ/Dp-0D8NwvrE/s128/vtechtip_b2.png";

imgr[4] = "http://lh6.ggpht.com/_t2Z6nkGKLVc/SwFhLrXGA0I/AAAAAAAAAvk/69EKKkaI738/s128/Windows%207.png";

showRandomImg = true;

tablewidth = 248;

cellspacing = 1;

borderColor = "#30a1db";

bgTD = "#fff";

imgwidth = 70;

imgheight = 70;

fntsize = 12;

acolor = "#000";

aBold = true;

icon = " • ";

text = "cm";

showPostDate = false;

summaryPost = 50;

summaryFontsize = 12;

summaryColor = "#000";

icon2 = " → ";

numposts = 10;

rc_feedLink = "http://www.vtechtip.com/feeds/posts/default";

</script>

<script type="text/javascript" src="http://sites.google.com/site/vtechtipcom/home/vtechtip_recentpost_thumb.js"></script>
Explain:



imgr[0] = random images url.


showRandomImg = true if you want use random images, false if no.

tablewidth = width of the widget.

cellspacing = Space between cells (default one is good)

borderColor = order color (add the background color of your template to perfectly blend it in the template)

bgTD = background color of widget.

imgwidth and imgheight = width and height of thumbnail.

fntsize = font size.

acolor = color of the title.

aBold = do you want to bold title? (true or false)

icon = change icon before title. Can leave blank.

text = text stand for comment (may be cm, comments, comment(s) etc.)

showPostDate = do you want to show post date (true of false).

summaryPost = amount of characters of summary.

summaryFontsize = font size

summaryColor = font color.

icon2 = icon before summary, can leave blank

numposts = amount of post display in widget.

rc_feedLink = Your blog feed url. Default is http://www.yourblogurl.com/feeds/posts/default. If you want only show recent post from specific label, you need change url to: http://www.yourblogurl.com/feeds/posts/default/-/LabelName. Ex: Use http://www.bmagics.blogspot.com/feeds/posts/default/-/Video to show recent posts from label Video.

<script type="text/javascript" src="http://sites.google.com/site/vtechtipcom/home/vtechtip_recentpost_thumb.js"></script>: this javascript is stored in this site. 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.