How to Add Translator Flag For Blog

In this post we will learn how to add the Translator Flag  in your blogger/blogspot blog. Blogger Users here we go with the steps.
I hope you know how to add widgets to your blog.
1. Log in to your dashboard–> layout



2. Click on “Add a Gadget” where you need to place the login box or form. 



3. A Pop-up window will open and select the Click on “Add a Gadget” and select “HTML/Java Script”.



4. Copy the code below and Paste Inside the box.

5. And replace this URL  http://thejinnni.blogspot.com

<span class="Apple-style-span" style=" color: rgb(102, 102, 102); line-height: 18px; font-family:Verdana;font-size:12px;"><a class="google_translate" href="http://thejinnni.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="Urdu" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7cur&amp;hl=en'); return false;"><img alt="Urdu" border="0" align="absbottom" title="Urdu" height="60" src="http://1.bp.blogspot.com/-QmWshuaHPOM/T0A64knecXI/AAAAAAAACMY/gF8DPZ6ZBIU/s1600/pakistan-flag.gif" width="96" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a> <a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="Hindi" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7chi&amp;hl=en'); return false;"><img alt="Hindi" border="0" align="absbottom" title="Hindi" height="60" src="http://1.bp.blogspot.com/-s4RrySXOqZo/T0A63_Ks4xI/AAAAAAAACMQ/v2oe7IomTbg/s1600/india%20flag.gif" width="96" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a><div class="separator" style="clear: both; text-align: center; "><a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="English" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7cen&amp;hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixYps3Q5o5DmWIEgLB6WgWpqf9I57gWyK4y8nZpWexGYXKZOG6zQmX8avyd-Txs6GQ2y3B7qwnPs87_6jdBC7gX8FRU0h-TwEMPe3g5qObmg-SmCglN9HS3ZPIiPC9zFmMOZ2_jhn1Rkw/s200/United+Kingdom(Great+Britain).png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a> <a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="French" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7cfr&amp;hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsvBzg28OxUfQjaycobmHIH4EZleFmMAek57-2zTkXjUIxmE-o_iYaaqyadYHnfbxFKMtPfGMSU4mRAVJ60pcgoRO6qkN6dnj14fpQRsl3EZoZ3jkyCLXXjODC_XquMp2hwqZ68iVm258/s200/France.png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a> <a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="German" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7cde&amp;hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk-xHQICFPP32Fb2qlI9kp7RH5hEQl1IJzrmi5gXJCvuk5IDNBjdILW37YCTNOhpu3-Ro2QNI0TcmB1KsL7idOsLwRG5MIsD9bVhataOMLDEDN8NrucEq6i9L1LGPlVGwpM7O15sEHpSE/s200/Germany.png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a> <a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="Spain" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7ces&amp;hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLonRWVmZ4rlwOOEdQz1PMGscvUIMe_1-FrN8EZ3_c-EAiuokIOHBMg7KNGJtcCBkLie9Eswj3f2-PSIrD0_3-w-f3LAie2xlH4X1_Gh9pDmm4CcMpOlXa8NZk-82yDonFs_JJzemGN7I/s200/Spain.png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a> <a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="Italian" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7cit&amp;hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixUKsnj5SfG9wLMbS8yIcjQmNpq5nljFJE_TlZ05BzgxPQe92dJZXY3xCvlMKAzX-o1XOYwSt6y32RnkRb2P_MgUXY3A_juNoQT1HsEkU_a2f8vGxYFCGPKnXNasoKZeUf-xY4yp16o-k/s200/Italy.png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a> <a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="Dutch" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7cnl&amp;hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4ADOV1grDyqqt7y-eYL65DoGP-IqJEq4fhm0zHBRVJZA1ASZoS0NyXeiOafb2qcOQtv8DSdxAIQlFo2i9gInXH_0A0gid9uwDzzYVmIzEF70yIVKXsHORzvrwiffPRDSqsoxW4Kt6Tf8/s200/Netherlands.png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a><div class="separator" style="clear: both; text-align: center; "><a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="Russian" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7cru&amp;hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpcMqhCAjQdcnQPSpnemIWGUVuvozzDpw1yK-HrkTllQa2I3IS0ofnOy8TbYcBJyHS6jnZoim44MpS0JuKkX6Xvq8lkvysN6tp4kbFD-vA8_lMtk2U0K9W6yPPfZnWZbGpOHRAvjQjO1w/s200/Russian+Federation.png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a> <a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="Portuguese" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7cpt&amp;hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirXwzA3NYf-Eb4MUEQVM5y7RiqGgfkFsttToV4xnaj_5-LaKLuqvFUA2_idhl-WKmeIliwOy9NXhJRvo7ajwGqR9e5IKhW6XqwOA6-9LdP8TYwRmErVC2iTyEuTHxAvicKwmuQb8q29KI/s200/Brazil.png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a> <a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="Japanese" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7cja&amp;hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0n5gdZKoLvngYWJsSh_ywwfooFmfmNiSl6jkGmz_WSaCw3eJ468ULZNuj_xclF7JTkzIXSsEuPyQRbCgMHiGRCirYeRXaJVq5bkoc9lK0YrpOZdA1DdjWSSoP8a8VVx4YOn1s0YbR9Kk/s200/Japan.png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a> <a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="Korean" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7cko&amp;hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiGzcCrQI_Qbt2fI3FsPB_1El5RNaFmQAdIT5Tuz0kctU0E2YuM_fpMgZblu0LOgRRqRcstrPhxto8NbVPXm4jw3bmPdoo8e2o_l-NEECa1rYqz4lvgg3DmIZmG00Rqez5d4QsRuOe42c/s200/South+Korea.png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a> <a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="Arabic" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7car&amp;hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiR8Jt59xefI547GhhvddT3m1a5yYkFJqhgDe6b0M1uz_ZD1Vf8snhacEKCutk4st0Mvi9CUVdkRQdeO73tshJwLfjjQhblH6quzhpSMumFoTqLeeVhaywxUV1suwS9gLZemJ0e1-QdA8M/s200/Saudi+Arabia.png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a> <a class="google_translate" href="http://mytopfreeware.blogspot.com/2012/04/chitika-ads-not-displaying-on-my-site.html#" target="_blank" rel="nofollow" title="Chinese Simplified" style="color: rgb(0, 132, 206); text-decoration: none; " onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href) +'&amp;langpair=auto%7czh-cn&amp;hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0StLYhC01d_XWHOJrJiOusntMkmGTi57prWSI0gBOy0ezjo9IsBTnylxH5v2Kgrq5C3Mp5X0stKG1cClS_qNaIJt-Pvnv3nb585_ZmYhnt8Xn8J1K-US4kUIb-voPQz_3lW2zPsAqqOs/s200/China.png" width="24" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 1; border-style: initial; border-color: initial; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; margin-top: 0px; margin-right: 8px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; cursor: pointer; " /></a></div></div></span>

6. Save the Html/Javascript and go on to your page to see how it looks.

You might also 

Add Sliding Twitter Follower Box For Blog

Many tutorial gives you how to add floating Facebook, Twitter, Google +1 share buttons. Now I come up with new tutorial for adding Sliding Twitter like Box for your Blogs.

This is a great way which requires almost no space and it looks more attractive than that of simply keeping the like box, it will float on your blog/website, and when the visitorsmouse over it will animate by sliding of left. So lets add this cool sliding Twitter like box to your blogger blogs.

STEP 1. Adding JQuery Pluging To Your Blogger Blogspot

1. Go To your Dashboard > Design > Edit HTML2. Search for </head> before it paste the following JQuery Code.3. (Ignore this step if you have already added JQuery Plugin yo your blog).

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>

4. Save your template

STEP 2. Add Sliding Twitter Like Box To Your Blogger Blogspot

1. Go To Blogger > Design > Page Elements 2. Click on "ADD A GADGET"3. Choose HTML/Javascript Widget4. Paste the Following Code inside it.

<script type="text/javascript">
//<!-- 
$(document).ready(function() {$(".twitterboxot").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() 
{$(this).stop().animate({right: "-250"}, "medium");}, 500);}); 
//--> </script> 
<style type="text/css">
.twitterboxot{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSRrIXtfb7x3Dk6aFCEwsDdORjsn9PunrSbU4QRZttvTehCwYczoVDLzpSlTGUflHs3vZTJxEw53Y0l8xXcV7oGc5UrY8peivbLzBV5Jb-3XBpbQCjljEMt5n8OmnYN7iJ7lUWbAr5PplG/s1600/twitterbox.png")
no-repeat scroll left center transparent !important;
display: block;
float: right;
height: 240px;
padding: 0 5px 0 46px;
width: 245px;
z-index: 99999;
position:fixed;
right:-250px; top:20%;}</style>
<div class="twitterboxot"><div>
<script type="text/javascript"
src="http://script-ot.googlecode.com/svn/twitterbox.js"></script><div 
id="twitterfanbox"></div>
<script type="text/javascript">fanbox_init("The Jinnni");</script></div><div style="font-size:10px;">
<a href="http:http://www.TheJinnni.blogspot.com.com/2011/12/sliding-twitter-followers-box-for-blogs.html" target="_blank">Get This Widget</a>
</div></div>

5. Replace The Jinnni with your Twitter Username. Save your template.
Visit your blog to see Sliding Twitter Like Box at right side of your webpage.