Google Translate Widget with Flags For Blogger

The Google Translate Widget for Blogger allows the visitors to translate your site or blog in their own language.
This widget also auto-detect your blog language and then translate it to the readers chosen language.

It supports 12 different languages:
English, French, German, Spanish, Italian, Dutch, Portuguese, Russian, Japanese, Korean, Arabic And Chinese.

How To Add The Google Translate Widget To Blogger

Step 1. Go to your Blogger Dashboard >> Layout and click on "Add A Gadget" link

Step 2. From the pop-up window, scroll down and choose HTML/JavaScript

 Step 3. Paste the code below in the empty box:

<script type="text/javascript">
function showHide(shID) {
    if (document.getElementById(shID)) {
        if (document.getElementById(shID+'-show').style.display != 'none') {
            document.getElementById(shID+'-show').style.display = 'none';
            document.getElementById(shID).style.display = 'block';
        }
        else {
            document.getElementById(shID+'-show').style.display = 'inline';
            document.getElementById(shID).style.display = 'none';
        }
    }
}
</script>

<style>

 .google_translate img {
margin: 10px 20px 0px 20px;
    height: 24px;
    width: 24px;
        }
        .google_translate:hover img {
filter:alpha(opacity=0.30);
        -moz-opacity: 0.30;
        opacity: 0.30;
        border:0;
        }

.more {
    display: none;
a.showLink, a.hideLink {
    text-decoration: none;
    color: #0880C4;
    padding-left: 18px;
    background: transparent('down.gif') no-repeat left; }

a.hideLink {
    background: transparent url('up.gif') no-repeat left;
color: #0880C4;}

a.showLink:hover, a.hideLink:hover {
color: #0880C4;
 }

 </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/AVvXsEj_m-25G-0aJr4XO1IYXYxDR8hyvFxG7nWLFJDyQILU59oqQBi19VblOGF9nfh9AqXdbi8J33GvR_56kHiZYS3aUQ-tjEmPzegwSaU8P7i7SFTjtMYBeRaZr1l0tqbZjKIBhPSmQtJqmW1R/s1600/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/AVvXsEjkG-9S7Z4h7_TImb0hOs4vsmeZUI1b7DvjqbuEewZ0-YrNVPk-zPOhVe2_U5jM_u35HcHRJ9wtq_etMqcMl85NXe1_YpOrAYamtVxVEZwsUcs3geDuln0Brn8oII3pgw8mrz5z8R6nFxkX/s1600/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/AVvXsEjHP5txiggUtMgSyJQe-LDP1AvgadKnM1D2XrK_rFb59rsLwK5aK2vB9c6mdwM6uBw9RtDlXwMEik8_LQl7_8yCWC2ktc0S4nhhRs_1v0JSeGIhc5P-Zbg4CKe5uQdDTMfZUGn_goUUQfvH/s1600/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/AVvXsEj0bEglR-gwOoHNiYDn_L6bfPZsmwVBQjB6fv5mUeJ5yN6LlykVr-RYZmDvfjLTPFKsFzH5_g-AwU2A9stnu05B3rui7ztYgYAkTPuHndGYDsbYnTMATQdCsq6Yurs0VycX64yQjPn_A5Dh/s1600/Spain.png" style="cursor: pointer;margin-right:8px" width="24"/></a><a href="#" id="example-show" class="showLink"
onclick="showHide('example');return false;">More</a>
<div id="example" class="more">
 <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/AVvXsEjbF3G8wk4aw86fj754bG2zva1mlG3qRdK9IxnsW6Xc3Usq1kMSvbqXVljieGJz7sI10IPtXa7fnjojdQtZ_x9GcPl9z-eHOflCj1_iff52FvWv_Sax9Z9imw60v0ruajAM9vnaj6d3wqke/s1600/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/AVvXsEhnevkNHfDIMAbNL_ilrYRLyCkTeIXf6Zo5Pt5WlYPR5Ztk59rYoMt34Q7OgbntTyRBFUeF2jbcR3bJ5TzaxfLZfeFvR9q4KfgDEpK16IijVwd44BH9YLQLZUDgjvjPa1-vJhDzcc5nKe8B/s1600/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/AVvXsEil-F04GuBfshaMmVodF3xtxNjHJikndEbCUmOme7N5iOKx4-aX4JhngAxpmrlQMzNaOhVLfaijzbQuSw93WxZl2zi0JgVI4Iubq5pdsbRWEn4k4F7TvF8HUKzxwpmT-i62cfrZDtErGla9/s1600/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/AVvXsEhCrjhoBo0JdhsUZQovAiV5FchKJB402PhXMlChZbZZArkj7DRTDWKPUGpgA6w_48r3ydjIcpedlWhOHsL2fXZygJC2QCg27-5w-AcBeIn_uU3blNUfZ52l5fbjWnHQh74_wOoXiKhpelDp/s1600/Brazil.png" style="cursor: pointer;margin-right:8px" width="24"/></a>
<br />
 <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/AVvXsEixei3Da63FcE8QKn7F34L3AMPqrB3AcGvEZgFftYBC_jReXHBiBmIP5T-QJaA_a5htQAo06tWpEcV6tRv2E9-ZlZdI9FuqzC53O2BuSzmUtU5fQrl8B3LcqvYJkjtfmMBXX-q6aUxqmTZL/s1600/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/AVvXsEjV40xg5JmXvhowu6LhcqbwnMSEm1Yz0s-1riVb7TD2yC-2N8grXxJvI5ULjginSfAraThUpURn3tgQAeM1b8Si4x-uw0k9Aq3AR2iNRqzGcPKCwXVm8pJdlG-bajcmceoceSXB9sR7J73j/s1600/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/AVvXsEgvMbKQaL34E9ZtgMpsOKxLEEJEwIycHaTwqTz6-ySCeunnMUQrlGX6p5Z_ojVArBsgn72EnOPg8fQqJRmsahnq0iiQmHnGyxA36lKi8wGGzwHcGLWy-PxO8ydJagmB9AlChyjxY_aSAGkh/s1600/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/AVvXsEh1O4wpkc8iBGRaKOVmNUgkSX8i5A4rtzdRIe0LXSk75SvQGyfXu03bkVbSjboWVtyCKoa7e2144MfDg0Bk4JC67GPFEh4_rufsUM1ayjW1ZmxtFJdiNGNYcA8u_Rzi-nS_1tr9sY-eLsjQ/s1600/China.png" style="cursor: pointer;margin-right:8px" width="24"/></a>
    <p><a href="#" id="example-hide" class="hideLink"
    onclick="showHide('example');return false;">Hide</p>
</div>
     </div>

Step 4. Now click on Save

And you're done! Enjoy (: