Bandeiras para traduzir seu blog

Olá amigos!

Bom, hoje vou postar aqui, um pequeno tutorial de como colocar um tradutor com bandeiras dos países, um método bastante simples mas muita gente apanha um pouco, até eu apanho =X.

Está barrinha de tradutor é um widget parecido com o Widget de Tradução do google, mas sem aqueles escritos chatos que as vezes quebra o design do seu blog. Lembre-se, sou iniciante como a maioria de vcs aqui, estarei aberto para novas sugestões, críticas construtivas e coisas do tipo.

A primeira coisa a se fazer é procurar as images das bandeiras, eu achei as minhas no Google Images, procure por Icons Flags, flags.gif, ou se vc gosta de tudo mastigadinho pronto pra engolir, clique aqui.
A próxima coisa a se fazer é hospedar as imagens das bandeiras que vc irá usar. Eu hospedei as minhas no ImagesHack.

Agora pegue o código abaixo e cole em um .txt (bloco de notas):

<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" 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" 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" 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" 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" height="20" title="NOME-DO-SEU-BLOG in italiano"/></a>
</div>

Pronto, agora vamos modificar a bagaça!
Vamos ao código que vc salvou em .txt, onde estiver escrito Nome-Do-Seu-Blog, mude para o nome do seu blog, lembre-se, é o nome e não a Url, Ex: Info Blogui.
Onde estiver http://ENDEREÇO-DE-SUA-IMAGEM mude para a url de onde vc hospedou a imagem.

Procure pelo código:

=pt%7Cen&hl=en

para cada bandeira vai ter um pedaço assim, vamos intender pra que serve.

pt é o idioma nativo do blog, no caso de blogs em Português, se o idioma do blog fosse inglês, no lugar de pt tinha um =en

en será o idioma em que o blog vai ser traduzido, se for traduzido para árabe, em vez de en teria um ar, se fosse para russo teria ru, se fosse japonês teria ja, ou coreano ko. Mude de acordo com cada bandeira.

As únicas coisas que achei importante mudar era isso ai.
Para vc saber qual a abreviação do idioma que quer traduzir, vá a página de tradução do Google digite alguma coisa na caixa, escolha o idioma e clique em traduzir. Fiz um exemplo em inglês mesmo, repare no link do seu navegador, vai ter um código mais ou menos assim:

http://translate.google.com/translate_t?hl=pt#pt|en|

note no fim do código |en| indica que está sendo traduzido para inglês.

Agora, chegou a hora de instalar seu widget, para isso, copie o código que vc salvou e modificou no .txt,
vá em "Elementos de página" adicione um gadget Html/Javascript. Pronto.

Neste tutorial coloquei apenas 5 idiomas para tradução: Inglês, Espanhos, Francês, Alemão e Italiano.

Espero que tenham gostado
Comente =P

-