Sunday, June 16, 2013

Horizontal Recent Post With Thumbnail For Blogger

How TO Put Recent Post With Thumbnail For Blogger.

With the recent post with thumbnail displays horizontally, is not only will add to your blog looks good, but also make it easier for readers to see what you just posted.
I found this code in mariannelenox site (, and very interested in what can be displayed. Although static, this helps keep our blog to make it look better in providing information.
Here's what its look like :

recent post

To try it, first log into your the blogger account.
In Dashboard, go to Design --> Page Element Layout
Add Gadget and choose Html/Javascript gadget, the copy this code below :

<script language="javascript">
imgr = new Array();
imgr[0] = "Your-Image-Url"; //default-image
imgr[1] = "Your-Image-Url"; //default-image
imgr[2] = "Your-Image-Url"; //default-image
imgr[3] = "Your-Image-Url"; //default-image
imgr[4] = "Your-Image-Url"; //default-image
showRandomImg = true;
tablewidth = 248;
cellspacing = 8;
borderColor = "#ffffff";
bgTD = "#ffffff";
imgwidth = 118;
imgheight = 100;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 50;
summaryFontsize = 11;
summaryColor = "#666";
icon2 = " ";
numposts = 5;
home_page = "";
<script src=""

http://Your-Blogspot-Home-Page -
imgr[0] = "Your-Image-Url" (default image for post which not contain image)

You should change both with your url.

That's it, Now you have a related posts with thumbnail in your blogger widget. for more javascript choice, you can visit mariannelenox site above.

Thank's For Reading


Post a Comment