Como inserir um tradutor em seu blog?

Tradutores são bons para quem quer atingir um público mais extenso e de outros países. Eu mesmo gosto muito de ter leitores de todos os lugares possíveis no mundo e gosto de ter sempre à mão um tradutor que possa estar a disposição de quem precisar.

Claro que existem tradutores online como o Google Translator, mas isso torna muito dificultoso para seus leitores e eles podem acabar abandonando seu blog por causa desse motivo "insignificante".

Nesta postagem estarei ensinando você a inserir em seu blog um gadget em seu blog e ainda personalizá-lo se desejar. Caso não tenha interesse em pessoas de outros países, poderá aguardar o próximo post.


Tradutor com Bandeiras Personalizável

O Tradutor que apresentarei para você nesta postagem é baseado no Google Translator e possui 8 bandeiras com os principais idiomas falados no mundo todo. Veja a imagem do mesmo logo abaixo:

Os idiomas disponíveis são: chinês, francês, alemão, italiano, japonês, inglês, russo e espanhol.

Atenção! Sempre salve um backup de seu blog antes de fazer alterações para evitar problemas.

Agora acompanhe o código deste tradutor logo abaixo e como instalá-lo em seu blog:

1. <img style="border: 0px solid ; cursor: pointer; width: 32px; height: 32px;" alt="Google-Translate-Chinese" src="http://lh3.googleusercontent.com/-zJcRmvyZeqg/TgR-ZYylXjI/AAAAAAAAAc0/K7zjOEW_c9k/China.png" title="Google-Translate-Chinese"/><!--&#8211; END Portuguese to Chinese (Simplified) BETA&#8211;--><!--&#8211; Add Portuguese to French &#8211;--><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cfr&hl=pt&ie=UTF8'); return false;" title="Google-Translate-Portuguese to French "><img style="border: 0px solid ; cursor: pointer; width: 32px; height: 32px;" alt="Google-Translate-Portuguese to French" src="http://lh4.googleusercontent.com/-1_xfDWxVXb8/TgR-Zf3arJI/AAAAAAAAAcw/v1UHWeheALI/France.png" title="Google-Translate-Portuguese to French"/><!--&#8211; END Portuguese to French &#8211;--><!--&#8211; Add Portuguese to German &#8211;--></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cde&hl=pt&ie=UTF8'); return false;" title="Google-Translate-Portuguese to German"><img style="border: 0px solid ; cursor: pointer; width: 32px; height: 32px;" alt="Google-Translate-Portuguese to German" src="http://lh3.googleusercontent.com/-a3bdK-4BE10/TgR-Z0FjH7I/AAAAAAAAAdE/DwtLYdwagEE/Germany.png" title="Google-Translate-Portuguese to German"/><!--&#8211; END Portuguese to German &#8211;--><!--&#8211; Add Portuguese to Italian &#8211;--></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cit&hl=pt&ie=UTF8'); return false;" title="Google-Translate-Portuguese to Italian"><img alt="Google-Translate-Portuguese to Italian" style="border: 0px solid ; cursor: pointer; width: 32px; height: 32px;" src="http://lh6.googleusercontent.com/-1Qy-TGJ4IwU/TgR-aJmFh4I/AAAAAAAAAc8/ZbmRuLofLvI/Italy.png" title="Google-Translate-Portuguese to Italian"/><!--&#8211; END Portuguese to Italian &#8211;--><!--&#8211; Add Portuguese to Japanese BETA &#8211;--></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cja&hl=pt&ie=UTF8'); return false;" title="Google-Translate-Portuguese to Japanese BETA"><img style="border: 0px solid ; cursor: pointer; width: 32px; height: 32px;" alt="Google-Translate-Portuguese to Japanese" src="http://lh5.googleusercontent.com/-YScFcLVIjSs/TgR-aFEIroI/AAAAAAAAAdA/szXrSqVHHMk/Japan.png" title="Google-Translate-Portuguese to Japanese"/></a><!--&#8211; END Portuguese to Japanese BETA &#8211;--><!--&#8211; Add Portuguese to English &#8211;--><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cen&en=pt&en=UTF8'); return false;" title="Google-Translate-Portuguese to English "><img style="border: 0px solid ; cursor: pointer; width: 32px; height: 32px;" alt="Google-Translate-Portuguese to English" src="http://lh6.googleusercontent.com/-ZKQb3kfej4s/TgR-aYUEjlI/AAAAAAAAAdI/Y-CRQGHv3T8/United%252520States%252520of%252520America%252520%252528USA%252529.png" title="Google-Translate-Portuguese to English"/><!--&#8211; END Portuguese to English &#8211;--><!--&#8211; Add Portuguese to Russian BETA &#8211;--></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cru&hl=pt&ie=UTF8'); return false;" title="Google-Translate-Portuguese to Russian BETA "><img style="border: 0px solid ; cursor: pointer; width: 32px; height: 32px;" alt="Google-Translate-Portuguese to Russian" src="http://lh6.googleusercontent.com/-JkDHplfaKsc/TgR-aekwwvI/AAAAAAAAAdM/5IAGTLGSN2s/Russian%252520Federation.png" title="Google-Translate-Portuguese to Russian"/><!--&#8211; END Portuguese to Russian BETA &#8211;--><!--&#8211; Add Portuguese to Spanish &#8211;--></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Ces&hl=pt&ie=UTF8'); return false;" title="Google-Translate-Portuguese to Spanish "><img style="border: 0px solid ; cursor: pointer; width: 32px; height: 32px;" alt="Google-Translate-Portuguese to Spanish" src="http://lh5.googleusercontent.com/-LkgU5pvZGcQ/TgR-ZgJmbRI/AAAAAAAAAc4/HP3GC0633vo/Spain.png" title="Google-Translate-Portuguese to Spanish"/></a><br />
2. Copie todo o código acima e execute a seguinte sequência: Faça login no Blogger > Selecione o blog > Layout > Adicionar um gadget > Escolha um gadget HTML/JAVAScript e cole o código.
3. Visualize para ver como ficará o tradutor em seu blog. Caso não fique bem ajustado terá que fazer alterações nos códigos. Se ficou perfeito, salve as alterações feitas no blog.

Agora preste atenção nas cores que coloquei no código. Em vermelho você tem as URLs de cada ícone usado nas bandeiras. Se quiser poderá procurar ícones nos tamanhos 32 x 32 pixels no formato png e substituir copiando a url e colando no lugar das contidas no código.

O nome de cada uma está no final de cada URL encontrada no código em inglês.

Para mudar o tamanho dos ícones das bandeiras, você terá que mudar os números em azul; onde cada um pertence a uma bandeira e as tags width e height são largura e altura.

Para aplicar este código em outros blogs é necessário que você tenha conhecimento em HTML ou sobre os recursos da plataforma que estiver usando.

Conclusão

Infelizmente não dou muita preferência para códigos por aqui por não serem tão importantes assim; mas terei que fazer algumas alterações indesejáveis no Processo Blogs para atender alguns leitores que querem aprender e ter acesso a códigos como este que apresentei aqui.

Este blog está protegido contra cópias para valer e não é possível nem mesmo selecionar os textos. Os plagiadores já devem ter notado isso a algum tempo já.

Mas estarei trabalhando para retirar o esquema de proteção para que os leitores possam copiar ao menos os códigos para inserirem em seus blogs.

Caso queira entrar em contato por algum motivo, acesse a página de contato através deste link: Contato.

Envie dúvidas, reclamações, sugestões, elogios e assuntos mais complexos relacionados ao artigo e em 24 horas estarei lhe respondendo prontamente.