GOOGLE TRANSLATE FLAGS WIDGET FOR BLOGGER

Widget Features

This widget is a great one and the best translate widget ever and here are the features.

·      This Widget Auto detect your blog language and translate it to the readers chosen language.

·      Support 12 different languages, English, French, Germany, Spanish, Italian, Dutch, Brazilian, Russian, Japanese, Korean, Arabic And Chinese.

·      Auto Adjustment, No matter where do you add this widget, it’ll be auto adjusted with your blog template.

Widget to our blog. It’s easy and one step trick.

How To Add It To Blogger.

It’s very easy to add this widget to your blog, just go to your blogger dashboard >> Layout>> and on page elements page, Click Add A Gadget and choose HTML/JavaScript 
Leave the title empty or type any title for your widget, and in the content area paste the following code.

<style>

 .google_translate img {

        filter:alpha(opacity=100);

        -moz-opacity: 1.0;

        opacity: 1.0;

        border:0;

        }

        .google_translate:hover img {

        filter:alpha(opacity=30);

        -moz-opacity: 0.30;

        opacity: 0.30;

        border:0;

        }

        .google_translatextra:hover img {

        filter:alpha(opacity=0.30);

        -moz-opacity: 0.30;

        opacity: 0.30;

        border:0;

        }

  </style>

 <div>

 <a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggXSTLDCiqp3i41BZQNfMWh6Uiaq3B2kYOc8fG_DtuQz1NUfHaIAF_-oV3n6dnvKam5kRpqZIE8gAAnNjFY_hVysJASSXEdsAbobS9vHfphl9kiQ9LoQZy3OK4jB78Jml-uDX-XRfc4J0/s200/United+Kingdom(Great+Britain).png" style="cursor: pointer;margin-right:8px" width="24"/></a>

 <a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUKKoitX06hC2Ti88YhIcK4ymh4fIZobqInsjB8eAgQH8yX6hA-sVVyQoDaAB1puxqRpoohfRgC7LJ_mMQj1tCC-Qc-vVKlri_GuAibKggVW0OIqCUGahxe3I0lcOkKars1ghjkdv2XHU/s200/France.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

 <a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLH3kWppuRmNPcrhwwGtULNVmlVDhoO1r_dPRHZFuczoNs_XfvtZD45HaXS5Q7Y_52V52w5L2tIkA8qpl7rb87y2ucwQtBZuPRyyQXLbZidyLcgovnR1v_o-s1OH0q4OJZsskc2IlKyBw/s200/Germany.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

 <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguOExnboG6zw_GH1-lhk0vF4j2Khkhc2rMzd3jbX0t0BFPpYLwcXKKeYOqVn13VEbTzmhVrxbzEWnWD12DbQdySsY9uKi7S4sJpDG-m-in6Q5FVvuUxfr2K_HNlEATVJ4H0kQ2UgjoF9Y/s200/Spain.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

 <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiizngxKagUS2RjIdtpb6vBLQCKzJmnX_sgfXHDTGzyhraVodvCYi4gH2j6mNnU3PivRP8ci8x0j29kwMIKso5Lwqw3UhpH8pAiSpoMd7Biax3-wm6s4yzR9J5yNVqBycPgNzKmZEWLkNs/s200/Italy.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

 <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnjww6Yoj3EG5T8QxFtHbi3GLgmsFPdmUjmyPOsUraapEnKPQVJ6knZ-AzLwBDg7Y11HVm31-rz4tHw5uD7871ZSmstBpHDMtd6fTo15XZ2f8qm4lvNJOW-lD821KIgoEwXBndzArmym0/s200/Netherlands.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

      <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheiNQLbK1NbqBd4T268P0loVwbThFcxxlQSUMQ9gzLKAF6u7UalKN2429Tm5AbqYDzfmZ-Z-CkNeD09JVRoDmWFi7ETWJhY2BdpQSxa9Hs3ZxTGRCcmrcEy33M6dGiyDL40DlTOlohMss/s200/Russian+Federation.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

 <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFI9DYGfBig2_wHgFoXazXi6U03XfIcoMhMJKS__rkZMipSgdoP9aHhSBwyp7AUmqxWBgscmUAHUEmTWCnLiamoLnOOZBk0Xte1zDP0C342yNkqMaMuspUh4ZZ_jAbbSIRzDd5IqfGm-0/s200/Brazil.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

 <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBc_5CFlKkK1vRFmhQH0lV5rNmBaWAsiduhK8NubrzIFWMeHmi7pOokhog4XY17BxuBlt9kO0g3Cy4DCJe1IcDtAF1ZZP-76uc_16UhgI-OkGB4OBA_vhnDfpsCllJSbucipf5wt03-4w/s200/Japan.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

 <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgK8Ca7z9FpppjhmnemPK3Sgjl0fuyhN3RZ2SGodK080WaF-0er2I_vKF5dzI9gqYRyG2q9_PXb8kePF9BspdgOn7oOnunJRURoUGeg6eHJktCCM2elWflkWuOz3N8eBlYkzBlzS7RCQmQ/s200/South+Korea.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

 <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSj1wpJBj0oexOppLeJTJEeOA40yuwc-pDZea7b-yi5Bf_JPB6Fz0tBuojwA9dgknyN_g78Y283yAJf1NF4hbKPjAuqwD6LuC9s-NtTy4ao84ICV91x69PEDiCRZq_de9e8lFz1gcHgLI/s200/Saudi+Arabia.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

 <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=auto%7Czh-CN&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/AVvXsEjjG8uAZEXcJkYkXCBjdqaucqckok3bmu5twOfcm6YEoluGsfPISakUhoqQ1fNHxEsULRq9XploxA920SWV9143TeZJKUvaZcwJUAq72g7u-TY6ICQkPO7u2nxp22OK-zKjAcFVRS-c4LQ/s200/China.png" style="cursor: pointer;margin-right:8px" width="24"/></a>      </div> 

  <div 0px 0pxâ?? style="â??font-size:10px;margin:8px" 3px></div>

 <br/>

And click Save

Then check your blog.

REMOVING SHOWING POSTS WITH LABELS, SHOW ALL POSTS

If you want that in your blog it should not show showing posts with labels, show all posts then follow the steps given below it will hopefully solve your problium.

1. First, as always, make a back-up your template

2. Go to:  Dashboard > Layout > Edit HTML > Download full template.

 

3. Check the box to  "Expand Widget Templates"

4. Find this code:

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>


5. REPLACE it with the following:

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

6. Click Preview.

7. If all is well, save.

ADDING FLOATING SOCIAL MEDIA SHARING BUTTONS

Here’s a tutorial on how to add a Mashable-like floating bar of social media buttons to a Blogger blog (or a WordPress blog or just about any website). I made it into a widget, so you don’t have to go into your template HTML to install (or remove) them. Just drop the whole code into a HTML/Javascript gadget.

I have included Facebook Share, Retweet, StumbleUpon, Google Buzz, Digg This and Google +1 (plus one) buttons in the bar. Each of them comes with a live counter. The corners of Facebook Share button and counter are rounded to blend with the rest of the buttons (doesn’t work in Internet Explorer though). You can add more social bookmarking or sharing buttons later if you wish.

I. Adding the buttons

Adding to Blogger

1.   Go to Design > Page Elements.

2.   Click Add A Gadget.

3.   In Add A Gadget window, select HTML/Javascript .

4.   Copy the code below and paste it inside the content box.

5.   Save the gadget.

6.   Drag the gadget and reposition it under Blog Posts gadget.

7.   Click Save button (top right hand corner).

Adding to WordPress

1.   Go to Dashboard > Appearance > Widgets > Available Widgets.

2.   Drag Text widget into a sidebar.

3.   Paste in the code.

4.   Save.

<!-- floating share bar Start softhitz.blogspot.com-->

<style type="text/css">

#pageshare {position:fixed; bottom:15%; margin-left:-71px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;}

#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}

.fb_share_count_top {width:48px !important;}

.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}

.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;}

.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}

</style>

<div id='pageshare' title="Get this from softhitz.blogspot.com">

<div class='sbutton' id='fb'>

<a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>

</div>

<div class='sbutton' id='rt'>

<script src="http://tweetmeme.com/i/scripts/button.js" type='text/javascript'></script>

</div>

<div class='sbutton' id='su'>

<script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script>

</div>

<div class='sbutton' id='digg' style='margin-left:3px;width:48px'>

<script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script>

<a class="DiggThisButton DiggMedium"></a>

</div>

<div class='sbutton' id='gplusone'>

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>

<g:plusone size="tall"></g:plusone>

</div>

<div style="clear: both;font-size: 9px;text-align:center;">Get <a href="http://www.softhitz.blogspot.com/">widget</a></div><!-- Do not remove this link -->

</div>

<!-- floating share bar End -->

II. Customizing

1.   Vertical alignment 
Change the value of bottom in code line 3. The code positions the button relative to the bottom of your browser window. To fix the distance even when window is resized, specify the value in px (pixels) instead of %.

2.   Horizontal alignment 
Change the value of margin-left in code line 3. Negative value pushes the button to the left of the main blog column, positive value pushes it to the right. 
To position the button relative to the left or right edge of browser window, replace the margin-left with left (as in left:10px;) or right (as inright:10px;) respectively.

3.   Replacing and removing buttons 
You can replace existing buttons with your own. Each button is represented by this code:

  <div class='sbutton'>

   BUTTON CODE

  </div>

 

To replace the button, simply replace the button code with the new code.

To remove the button, delete the whole div.

Update (for Blogger): If somehow your Google +1 button doesn’t appear despite other buttons appear

successfully, try this workaround:

1.   Go to Design > Edit HTML and find this line:
<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>
or 
<body>

2.   Copy the code in step I.5 and paste it right below the line.

3.   Replace the margin-left:-71px; in code line 3 with left:10px;.

4.   Preview before saving.

Enjoy!