30 de janeiro de 2009

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

-

5 Comentários:

AndersonZ1 disse...

Cara fiz tudo certo mais o tradutor não funciona, a imagem ta Ok, escolhi umas bandeiras redondas, mas se eu escolho uma opção para traduzir, continua em protugues, não tem nenhum lugar que pede a minha URL?, tinha que ter eu fiz varias modificações, mas nenhuma fez com que o blog fosse traduzido.

blackchip disse...

Anderson, vou te mandar o código que eu modifiquei e coloquei no meu blog, ai vc soh muda o endereço das imagens ok ?

Serafín Fernández disse...

Oi tudo Bem! poderia enviar para mim também?

Паула disse...

nossa...muito bom.... :)
valeu

SILVANO MARTINS disse...

OLA TUDO BEM?
MUITO BOM O POST!
TEM COMO VC M MANDAR OS CODIGOS DOS SEGUINTES:
JAPÃO
RUSSIA
KOREA.

OBRIGADO

Postar um comentário

Twitter

Seguidores

Comentários recentes

Lomadee, uma nova espécie na web. A maior plataforma de afiliados da América Latina

  ©Template by Dicas Blogger, modificado por InfoBlogui.

TOPO