Add Language Translator/ Flags Images Widget To BlogSpot Blog

If you are having a blog and receiving visitors from various countries and cities of the world, then they may or may not be comfortable with the language of your blog. So adding a translator button or a widget is always useful.
If you do not know the location of visitors coming to your blog, then you should first read my post on track your blog's visitors.

You have two options to add a translator:
1. By this method, you will get a compact translator, with a drop-down menu. And the method is really simple too.
You can see this translator in action in the sidebar of this blog.

To add a widget/gadget do this:
Log in to Blogger
Go to Layout and then Add a Gadget -> HTML/Javascript
Now copy and paste this code in to it:

<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'en'
}, 'google_translate_element');
}
</script><script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

*source - Google

Although by this method you will get a compact translator widget, but if you do not want to show the link to Google, and rather you would like to show some flags of different countries, like this one:





To get these flags translator buttons, you have "Add a new Gadget" -> HTML/Javascript
then copy and paste this code:

<center><table border="1">

<tr>

<td><form action="http://www.google.com/translate">

<script language="javascript" type="text/javascript">

<!--

document.write ("<input name=u value="+location.href+" type=hidden>")

// -->

</script><input value="http://YOUR_BLOG_ADDRESS" name="u" type="hidden"/>

<noscript><input value="http://YOUR_BLOG_ADDRESS" name="u" type="hidden"/></noscript>

<input value="en" name="hl" type="hidden"/> <input value="UTF8" name="ie" type="hidden"/> <input value="" name="langpair" type="hidden"/>



<input onclick="this.form.langpair.value=this.value" title="Andorra / Catalan" value="en|ca" type="image" height="20" src="http://1.bp.blogspot.com/__v4nth5_ki0/SP-fM7vwhSI/AAAAAAAAHl0/ZoZkfhEb01M/s320/Andorra+-+Catalan+-+ad_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="العربية / Arabic" value="en|ar" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/358406/gse_multipart12399.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title=" България / Bulgaria" value="en|bg" type="image" height="20" src="http://2.bp.blogspot.com/__v4nth5_ki0/SMiXtQx-uLI/AAAAAAAAG6I/RuLPDhnFMXY/s320/Bulgaria+-+bg_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="中文（简体） / Chinese (Simplified)" value="en|zh-CN" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/546049/gse_multipart12397.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="中文（繁体） / Chinese (Traditional)" value="en|zh-TW" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/208681/gse_multipart12398.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Hrvatska / Croatian" value="en|hr" type="image" height="20" src="http://1.bp.blogspot.com/__v4nth5_ki0/SMhVoigYF0I/AAAAAAAAG5s/naE3NObTVZs/s400/Croatia+-+hr_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Česká Republika / Czech Republic " value="en|cs" type="image" height="20" src="http://4.bp.blogspot.com/__v4nth5_ki0/SMiX9aMIL3I/AAAAAAAAG6o/4-RYadolKWQ/s320/Czech+Republic+-+cs_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Danmark / Denmark" value="en|da" type="image" height="20" src="http://2.bp.blogspot.com/__v4nth5_ki0/SMiX9nD1NZI/AAAAAAAAG6w/ZnIBEtLIHEw/s320/Denmark+-+da_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Suomi / Finnish" value="en|fi" type="image" height="20" src="http://2.bp.blogspot.com/__v4nth5_ki0/SMiZwsOFndI/AAAAAAAAG8w/VlBr_zN32q8/s320/Finland+-+fi_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Français / French" value="en|fr" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/327620/gse_multipart12413.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Deutsch / German" value="en|de" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/734899/gse_multipart12400.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Ελλάς / Greek" value="en|el" type="image" height="20" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEid4X8NyqedwFRfQIUmVtrbGxgVGSlL1BAq3vQOJ_8K_aBHjKi3LBxHm9JwYeTHAfTYBRFAk6zyfIYavetkHXEkB0ztNeVkrSkXF70-4mEb_c7AX8hyphenhypheng57eV6NY70Gg0faqMjCWDVCL7bLo/s320/Greek+Flag+36x24.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="ישראל / Hebrew" value="en|iw" type="image" height="20" src="http://4.bp.blogspot.com/__v4nth5_ki0/SP-fNBP-7LI/AAAAAAAAHmE/fJeA_Sbl9w4/s320/Israel+-+il_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Hindi / India" value="en|hi" type="image" height="20" src="http://4.bp.blogspot.com/__v4nth5_ki0/SMiYu9muwaI/AAAAAAAAG7Y/lO6YgNdyHM4/s320/India+-+hi_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Bahasa / Indonesian" value="en|id" type="image" height="20" src="http://4.bp.blogspot.com/__v4nth5_ki0/SP-fNKvGgZI/AAAAAAAAHl8/UESh2PimM5U/s320/Indonesia+-+id_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Italiano / Italian" value="en|it" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/306145/gse_multipart12401.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="日本語 / Japanese" value="en|ja" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/443122/gse_multipart12402.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="한국어 / Korean" value="en|ko" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/581031/gse_multipart12403.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Latvija / Latvian" value="en|lv" type="image" height="20" src="http://2.bp.blogspot.com/__v4nth5_ki0/SP-fNX2rCXI/AAAAAAAAHmM/1LRWqh7YQBA/s320/Latvia+-+lv_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Lietuvos / Lithuania" value="en|lt" type="image" height="20" src="http://2.bp.blogspot.com/__v4nth5_ki0/SP-fNrJizVI/AAAAAAAAHmU/kdaran4uffk/s320/Lithuania+-+lt_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Nederland / Dutch" value="en|nl" type="image" height="20" src="http://1.bp.blogspot.com/__v4nth5_ki0/SMiZWUAFSOI/AAAAAAAAG74/lsNT2NI_oFI/s320/Netherlands+-+nl_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Norge / Norwegian" value="en|no" type="image" height="20" src="http://2.bp.blogspot.com/__v4nth5_ki0/SMiZWYWSvEI/AAAAAAAAG8A/7sOoou7far0/s320/Norway+-+no_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Pilipinas / Philipines" value="en|tl" type="image" height="20" src="http://1.bp.blogspot.com/__v4nth5_ki0/SP-f7gyN2aI/AAAAAAAAHmc/x_LSaXlHtCs/s320/Pilipnas+-+ph_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Polska / Polish" value="en|pl" type="image" height="20" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-DXLaYwUUqKnnPqprgrfwdmV9FfEbd91FOAKkK2eAjNUufraBet-X5_Ne_BA30kkED2ZxB_kv_QxWzQ4ApiISk9O8OlNr0rO_fyyytNUILodbzrq6JUitQCL_jna74bqjLEhndGTj5xWJ/s320/Polish+Flag+36x24.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Português / Portuguese" value="en|pt" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/670301/gse_multipart12404.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="România / Romanian" value="en|ro" type="image" height="20" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcn4WmY5SqDfQMgfq_fRxb_PsJCt8RB5_J9fLnsjmyZW_690hLQFnjpzH9Iqh70ke97y_0P5Fp6trriyVe6cRj4mFCViL4rxB0Ou-wK5JsgODoU6yxFadm8psrlJX7FZTRbPFLGnepqWpL/s320/Romainian+Flag+36x24.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Русский / Russian" value="en|ru" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/111692/gse_multipart12405.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Србија / Serbia" value="en|sr" type="image" height="20" src="http://3.bp.blogspot.com/__v4nth5_ki0/SP-f7_imioI/AAAAAAAAHmk/ytbpoyJHbmo/s320/Serbia+-+si_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Slovenčina / Slovak" value="en|sk" type="image" height="20" src="http://4.bp.blogspot.com/__v4nth5_ki0/SP-f79KzfyI/AAAAAAAAHms/-I315jcpHN0/s320/Slovak+-+sk_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Slovenija / Slovenia" value="en|sl" type="image" height="20" src="http://1.bp.blogspot.com/__v4nth5_ki0/SP-f8P0fwiI/AAAAAAAAHm0/Lzeh8mXiWvE/s320/Slovenia+-+si_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Español / Spanish" value="en|es" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/998398/gse_multipart12407.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Sverige / Swedish" value="en|sv" type="image" height="20" src="http://1.bp.blogspot.com/__v4nth5_ki0/SMiZwrYspyI/AAAAAAAAG8o/uVUWBAyZkVc/s320/Sweden+-+se_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="Україна / Ukraine" value="en|uk" type="image" height="20" src="http://3.bp.blogspot.com/__v4nth5_ki0/SP-f8Bg1AMI/AAAAAAAAHm8/b4jhQQPSvj4/s320/Ukraine+-+ua_flag.png" width="30" name="langpair"/>



<input onclick="this.form.langpair.value=this.value" title="tiếng Việt / Vietnam" value="en|vi" type="image" height="20" src="http://2.bp.blogspot.com/__v4nth5_ki0/SP-gZakjpuI/AAAAAAAAHnE/fwfNZkisDOA/s320/Vietnam+-+vn_flag.png" width="30" name="langpair"/>

</form></td>

</tr></table></center>

NOTE: In that code, you have type your Blog's Address in the appropriate places [In RED colour]

How to show Top Commenters/Commentators widget on BlogSpot Blogs

If your blog has some loyal visitors and commenters, so one way to show your gratitude for them is to make your blog a "dofollow" blog, or you can add a top-commenters widget to your blog.

Adding a top-commenters is very easy, Just log in to your Blogger account.
Now go to Layout -> Add a Gadget -> HTML/Javascript

Now copy and paste this code in to it:

<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ol>');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
if(obj.value.items[i].link == "")
var item ="<li>" + obj.value.items[i].title + "</li>";
else
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=7b5e76fd684f11e94320abd4e00fbbca&url=http%3A%2F%2FYOUR_BLOG_ADDRESS_WITHOUT_HTTP://&num=10&filter=BLOG_AUTHOR_NAME" type="text/javascript"></script>
<span style="font-size: 80%">Widget by <a href="http://posrama.blogspot.com">PosRama</a></span>

Replace everything in BLUE, with the appropriate details of your Blog. You may write any visitor's name or your own name in filter=BLOG_AUTHOR_NAME (and this name will be deleted from the top commentators list). You may of course change the number of commentators to be displayed. (shown in red).

Popular Posts Widgets For Blogger - New and Working

Log in to Blogger
Go to Layout -> Add a Gadget -> HTML/JavaScript

Now copy and paste this code in to the widget:

Widget Style #1

<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ul style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ul>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=28a6afad7c6ba1288c1b738277e42385&url=http%3A%2F%2FYOUR_BLOG_ADDRESS_HERE_WITHOUT_http://&num=10" type="text/javascript"></script>
<a href="http://posrama.blogspot.com" target="_blank"><span style="font-size: xx-small;">Popular Posts Widget</span></a>

NOTE: REPLACE everything in BLUE color in the code above with your blog's address without typing http://

The above code displays 10 posts, you can change it by editing the number being displayed in red !

The above widget code, displays the links/titles like this:

Post one (18)
Post two (14) etc.

If you want to display them like this:

Post one (18 comments)
Post two (14 comments),

then use this code :

Widget Style #2

<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ol style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=ML4p0UfW3RGgS7iN1JzWFw&url=http%3A%2F%2FYOUR_BLOG_ADDRESS_WITHOUT_http://&num=10" type="text/javascript"></script>
<span style="font-size: 80%">Widget by <a href="http://www.posrama.blogspot.com">Blogger Widgets </a></span>

And in case, you want to display the popular posts without the number of comments, use this code:


Widget Style #3

for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=097d1b822fc6f356d8376802a911036b&url=http%3A%2F%2FYOUR_BLOG_ADDRESS_WITHOUT_http://&num=10" type="text/javascript"></script>
<span style="font-size: 80%">Widget by <a href="http://www.posrama.blogspot.com">Blogger Widgets </a></span>

Create a Google Look-Alike Logo For Your Website or Blog

Here's a small post for those webmasters and bloggers or anyone who is a Google fan, and want to have his name, or his blog's, website's or company's name in the way Google Logo appears. As you can see in the image, I have made a logo for my blog's name.

Just visit this website:
GogLogo.com

Enter the text, and hit Enter, that's it !

Although you cannot save the final image as it is, because it is made by combining different letters, so to save the logo, take a screenshot [PrtScr] from your keyboard, go to Microsoft Paint (MS Paint), and paste and save it !

Send Your Blog Updates (Feed) to Twitter Automatically

If you have 100's of followers in Twitter, then you can easily invite them to your blog by tweeting your blog posts. But tweeting every time when you write a new post may not be so easy. So how about automatic tweeting of all the blog posts ?

Twitterfeed has made this very easy for you!
Just register and now onwards, every new post published on your blog will be straight away displayed in your Twitter updates...

NOTE: You don't have to register with a new name at TwitterFeed, use your OpenID to Sign In. For bloggers using Blogger.com as their blogging platform, they can use the url (******.BLOGSPOT.COM) of their blogs to sign in.
Then click on "create new feed" fill out the form and that's it....now your life will be more easier :)

Simple Recent Posts and Recent Comments Via Feeds Blogger

Recently I have posted about showing Related Post Widget in your blog, and also a post about Adding Favicon To Blogger. Here's another widget to be added on your blog, which shows the posts where recent comments have been made.

To add the widget, follow these steps:

Log in to Blogger, Go to Layout -> Add a Gadget -> Feed widget

For Recent Posts via FEED, then in the feed field, paste this url:

http://YOUR_BLOG.BLOGSPOT.COM/feeds/posts/default

For Recent Comments via FEED, then in the feed field, paste this url:

http://YOUR_BLOG.BLOGSPOT.COM/feeds/comments/default

Replace red text with your blog URL and select the appropriate options and save it. 

How To Add "Rating" and "FeedBack" In Blogger

Many of the visitors, usually do feel like leaving a comment on your posts, but finally due to laziness or no-time, they don't. If you still like to get a quick feedback from them too, then it is a better idea to place a "rating" system below all your posts, and also you can put a one-click poll like "feedback" system.

It is very easy to activate any/both of these options in your blog.
Firstly go to Draft.Blogger.Com instead of Blogger.com, (Draft.Blogger.com is the beta version of Blogger). Now log in, and go to "Layout" section. Then in the "Blog Posts" widget click on "Edit" link

Now in the new window that opens, you can activate the "Reactions" and "Ratings" options. Yau can even edit them before saving.

How To embed Flash And Javascript Files In HTML Posts

If people say "Pictures speak a thousand words", then it would not be wrong to say that "Flash and JavaScript speak a million words".

To make a successful and attractive blog, instead of plain and simple HTML of 1980's you should occasionally add flash(.swf) files and of course must include javascript files to your posts and sidebars.
The process is very simple, almost as simple as adding an image in HTML, the only difference is there are a little more lines of code to remember/copy :)

For embeding Flash Files:
First of all embed the flash content (file), to your Googlepages.com account or anywhere which gives a direct hotlink to the file, and of course also offers a good amount of bandwidth. That is why I prefer Googlepages.com fro this because Google never sets restriction on bandwidth, although web space available per account is limited to 100MB.

Paste these code lines, where ever you want to embed the flash file.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="700"
height="322">
<param name="movie" value="Name_Of_File.swf">
<param name="quality" value="high">
<embed src="http://DIRECT_LINK_OF_YOUR_FLASH_FILE.swf" quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="700"
height="322"></embed>
</object>

Note: Replace everything in the bolded color, with appropriate links and values.
In case your visitors do not have flash installed/enabled in their browser, they will be promted for installing it from Adobe.com

Note: In the code above there is both an <embed> tag and an <object> tag. This is because the <object> tag is recognized by Internet Explorer, and Netscape recognizes the <embed> tag and ignores the <object> tag.

For embeding Javascript Into HTML posts:
JavaScript code is typically embedded into an HTML document using the SCRIPT tag.

<script language="JavaScript">
<!--
document.write("Hello World!");
//-->
</script>

The LANGUAGE attribute is optional, but recommended.

<script language="JavaScript1.2">

Another attribute of the SCRIPT tag, SRC, can be used to include an external file containing JavaScript code rather than code embedded into the HTML:

<script language="JavaScript" src="DIRECT_LINK_OF_JAVASCRIPT_FILE.js">
</script>

Back Up Your Blog Posts And Comments

Blogger offers free blogging to anyone with a gmail account, moreover it offers more than one free blog for a person. We know it for sure, that our blogs are safe with Google (or call it Blogger).
But chances are there, that suddenly you may lose the content of the blog, which includes all the posts and the comments, like this case from Blogger-Help group :
brandyjolly (Nov 29, 6:45 pm)

I need help!
I was using blogger to present my masters project for my final
semester and found out that before it could get graded, the blog was removed. but my computer doesnt have a back-up because it broke a few weeks ago so now I'm left with seemingly nothing. Is there any way to recover my lost blog. There was no message other than it had been removed.

Please help!!!!!!


brandy

 http://groups.google.com/group/blogger-help-troubleshoot/browse_thread/thread/4a5ea72246c863f5

Now as in the above case, once the blog gets deleted, it is very difficult to recover the content (although you may try Google cache method, explained in the end of this post, incase your blog has been indexed by Google)

So, to avoid all those head aching tweaks, simply you should take frequent backups of your blog's content, comments and widgets whenever possible.
This method is just like backing up your blogspot template, the only difference is that, you have to log into Blogger Beta, and after completing the process, you will get an xml file containing all the blog posts with comments, which can be then uploaded to any other blog with any other template. Save that file on your computer, and somewhere online too.

Follow these steps:
First you have to log in to Draft.Blogger.Com and not into Blogger.com
Then go to Settings section
Now click "Export Blog", then click on "Download Blog". Downloading time depends on the number of posts and comments.

That's it. Now you can upload this file by a similar process to any new or old blog, while uploading you have to click on "Import Blog" in the settings section of the new blog, instead of "Export Blog", and upload that previously downloaded file. And finally you'll have all your blog content shifted to a new blog.

*Update: Another method to back up your content is to subscribe to your own blog through email/FeedBlitz. By this way, all new posts written by you will be delivered to your email inbox.

In case you are here, for a complete recovery of your blog's content, then it is only possible if your blog has already been indexed by Google. Go to Google.com and type this
cache:BLOG_NAME.BLOGSPOT.COM
Then immediately save those pages.

Or you have to request Blogger for your blog's content !

How to Add Related Posts Below Every Post

To add Related posts/Similar posts widget below every post on your blog, follow these simple steps:

First of all download this file:
relatedPosts_ForBlogger2.js

Zipped File*

Although you do not have to use this file as I have already linked the file in STEP #5. So, store this file as a back up on your PC.

1. Go to Blogger.com
2. Now go to "Design", then to "Edit HTML" section
3. Back up your present template, by "Downloading it"
4. Now click on "Expand widget templates"
5. Find this code:

</head>

 And just BEFORE/ABOVE this code, paste this:

<!--RelatedPostsStarts-->
<style>
#related-posts {
float : left;
width : 540px;
margin-top:20px;
margin-left : 5px;
margin-bottom:20px;
font : 11px Verdana;
margin-bottom:10px;
}
#related-posts .widget {
list-style-type : none;
margin : 5px 0 5px 0;
padding : 0;
}
#related-posts .widget h2, #related-posts h2 {
color : #940f04;
font-size : 20px;
font-weight : normal;
margin : 5px 7px 0;
padding : 0 0 5px;
}
#related-posts a {
color : #054474;
font-size : 11px;
text-decoration : none;
}
#related-posts a:hover {
color : #054474;
text-decoration : none;
}
#related-posts ul {
border : medium nonemargin : 10px;
padding : 0;
}
#related-posts ul li {
display : block;
background : url(&quot;http://www.gigaimage.com/images/brrl1rtaziisu0yj6kj6.gif&quot;) no-repeat 0 0;
margin : 0;
padding-top : 0;
padding-right : 0;
padding-bottom : 1px;
padding-left : 16px;
margin-bottom : 5px;
line-height : 2em;
border-bottom:1px dotted #cccccc;
}
</style>
<script src='http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/relatedposts_forblogger.js' type='text/javascript'/><!--RelatedPostsStops-->

6. Now search for this code line:

<data:post.body/>

 And after that line, paste this code:

<!--RELATED-POSTS-STARTS--><b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<font face='Arial' size='3'><b>Related Posts: </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script></div></b:if><!--RELATED-POSTS-STOPS-->

To change the number of similar/related posts to be displayed, change the code max-results=xx
Finally save your template, and you will see related posts after all your posts(Remember to add labels after your posts, during publishing them)

How to Hide/Remove Navbar

Follow these simple steps to completely hide the navbar in your blog :

1. Log into your Blogger account.
2. Select the Layout/Design tab (from your dashboard).
3. Go to Edit HTML section.
4. Under the Edit Template Box, 'copy and paste' the code from the green region below, exactly between the gray region (which will be already there in your blog) !

...
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name:     Rounders
Designer: Douglas Bowman
URL:      www.stopdesign.com
Date:     27 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */

#navbar-iframe {
   display: none !important;
}

/* Variable definitions
  ====================
   <Variable name="mainBgColor" description="Main Background Color"
             type="color" default="#fff" value="#ffffff">
   <Variable name="mainTextColor" description="Text Color" type="color"
             default="#333" value="#333333">
   ...

It will look like this now :

So open and see a Navbar free blog !

Add Favicon To Blogger/BlogSpot Blog Easily

Create A Favicon For Your Website
Fastest, Easiest and The Best Method Available On Internet
(You may even directly use an animated *.gif image as a favicon)

his is the easiest way to create a Favicon (the small icon  of a website visible at the along the url in the address bar) for your website !

There are many favicon generator websites, where you have to first upload a picture, edit/crop it and finally you get a *.ico that you can not even easily open to see, before you use it. Moreover if you want an animated *.gif image, then it makes the process even more difficult.

So finally here's the most simple code, edit & add it in the "head" region of your blog/website.... thats it!
You will see a new favicon the next time you open your website.

Log in to Blogger -> Layout -> Edit HTML
Find this in your template

</head>

And immediately ABOVE?BEFORE it, paste this code:

<link href="http://YOUR_IMAGE_ADDRESS_HERE.gif" rel="shortcut icon" type="image/vnd.microsoft.icon"></link>

Replace the link in bolded, with the DIRECT LINK to your pavicon URL.

To get the direct link, upload the desired image here first - Tinypic