This post explains how to add Recent Posts widget in Blogger with image thumbnails:
Yesterday, when I was working on my new Magazine style wordpress to Blogger template conversion (I'll release the template tomorrow )
..this idea popped up in my mind. This feature is also requested so many times here.. so, here we go..
After many trial n errors, I finally did it!
Features:
Thumbails to Recent Posts
Comment Count
Now follow simple step to add this widgt on your blog now. Yesterday, when I was working on my new Magazine style wordpress to Blogger template conversion (I'll release the template tomorrow )
..this idea popped up in my mind. This feature is also requested so many times here.. so, here we go..
After many trial n errors, I finally did it!
Features:
Thumbails to Recent Posts
Comment Count
* Sign into Blogger dashboard.
* Click on design TAB
*Now click on add new gadget
* And choose html/javascript from list
* when open new window copy below code and paste it on blank window.
<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://www.sohailjawaid.blogspot.com/";
</script>
Explanation:
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 titleaBold - you want bold titles? (true or false)
numposts - How many posts you want to show?
home_page : http://www.sohailjawaid.blogspot.com/ (change this to your blog url)
This script is currently hosted in my server ( 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.
4. Last but not the least.. Save the Changes.
That's it guys!
Note : Make sure you selected YES in Settings » Site Feed » Full » Allow Blog Feeds
boxwidth - Width of the widget.
No comments:
Post a Comment