Um Tradutor em seu Blog

Para iniciar você deve encontrar as imagens das bandeiras. Reuna quais idiomas você quer colocar em seu widget e faça o upload das imagens em seu site de hospedagem preferido. Eu uso o ImageShack

Na Guia "Layout" em "Elementos de Página" adicione um gadget HTML/JavaScript. Digite o título para seu tradutor. Eu escolhi 5 idiomas: Inglês, Espanhol, Francês, Alemão e Italiano.

Copie o código abaixo:

<div id="tradutor"> <a class="bandeira" href="#" target="_blank" rel="nofollow" title="NOME-DO-SEU-BLOG in English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cen&hl=en'); return false;"><img border="0" alt="English" width="30" src="http://ENDEREÇO-DE-SUA-IMAGEM/ingl%C3%AAs.jpg" height="20" title="NOME-DO-SEU-BLOG in English"/></a> <a class="bandeira" href="#" target="_blank" rel="nofollow" title="NOME-DO-SEU-BLOG en Español" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Ces&hl=en'); return false;"><img border="0" alt="Spain" width="30" src="http://ENDEREÇO-DE-SUA-IMAGEM/espanhol.jpg" height="20" title="NOME-DO-SEU-BLOG en Español"/></a> <a class="bandeira" href="#" target="_blank" rel="nofollow" title="NOME-DO-SEU-BLOG en Français" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cfr&hl=en'); return false;"><img border="0" alt="Français" width="30" src="http://ENDEREÇO-DE-SUA-IMAGEM/franc%C3%AAs.jpg" height="20" title="NOME-DO-SEU-BLOG en Français"/></a> <a class="bandeira" href="#" target="_blank" rel="nofollow" title="NOME-DO-SEU-BLOG in Deutsch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cde&hl=en'); return false;"><img border="0" alt="Deutsch" width="30" src="http://ENDEREÇO-DE-SUA-IMAGEM/alem%C3%A3o.jpg" height="20" title="NOME-DO-SEU-BLOG in Deustsch"/></a> <a class="bandeira" href="#" target="_blank" rel="nofollow" title="NOME-DO-SEU-BLOG in italiano" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cit&hl=en'); return false;"><img border="0" alt="Italian" width="30" src="http://ENDEREÇO-DE-SUA-IMAGEM/italiano.jpg" height="20" title="NOME-DO-SEU-BLOG in italiano"/></a> </div>

Para você entender o código por partes:
a class="bandeira" href="#" target="_blank" rel="nofollow" title="NOME-DO-SEU-BLOG in English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cen&hl=en'); return false;">http://ENDEREÇO-DE-SUA-IMAGEM/ingl%C3%AAs.jpg" height="20" title="NOME-DO-SEU-BLOG in English"/>

Modifique o que está em negrito.
O que está verde significa a abreviação do idioma: no caso (pt=português)
O que está vermelho é o idioma no qual a página de tradução do Google vai abrir.
O que está em amarelo significa a abreviação do idioma para o qual o blog deve ser traduzido.
Algumas abreviações de outros idiomas:
ar = para Árabe;
zh-CN = para Chinês simplificado;
ru = para Russo;
ja = para Japonês;
ko = para Coreano.

Aqui são os Estlos para a Widget:
#tradutor {
text-align: center;
margin-top: 10px;
}

.bandeira {
padding-left: 13px;
}

.bandeira a img,
.bandeira a:visited img {
border: 0;
}

.bandeira:hover img {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border: 0;
}

A propriedade "opacity" em "hover" faz com que as imagens adquiram transparência quando apontadas assamos o mouse sobre elas. Você pode muda-las ao seu gosto.
Obs: se caso a abreviação para o idioma que você escolheu não está na lista acima veja outras abreviações
Aqui