Personalizar o Gadget do Tradutor do Google




Hey galerinha linda! Trazendo mais um tutorial para vocês, e desta vez é para personalizar aquele Gadget do Google Tradutor.

E novamente, este tutorial veio do blog Reino Kawaii. Credite ela! Estou reblogando da minha forma. Clique em Leia mais para ver o tutorial.


Ele irá ficar assim, ou da cor que você quiser:


Primeiramente, você deverá colocar o Gadget do Google tradutor do seu blog. Vá em Layout>Adicionar Gadget e siga as instruções a seguir:


Coloque o título que quiser, mas deixe o Estilo em vertical! Feito isso vá em Modelo>Editar HTML e procure pelo seguinte código:

]]></b:skin>

E cole o seguinte código antes desta que você localizou:

/*****Personalizar tradutor*****/
.Translate .goog-te-gadget {/*texto com creditos ao google*/
margin: 4px 40px;/*posicionar*/
font-family: 'Delius Swash Caps', cursive;/*tipo de fonte*/
font-size: 12px;/*tamanho da fonte*/
color: #09BCCC;/*cor do texto*/
white-space: nowrap;
}
.Translate .goog-te-gadget a:link.goog-logo-link {/*personaliza o link*/
font-size: 12px;/*tamanho do texto*/
font-weight: bold;/*negrito*/
color: #D46D6D;/*cor do texto*/
text-decoration: none;
}
.goog-te-gadget .goog-te-combo {
margin: 4px 10px;/*posiciona a caixinha de selecione o idioma*/
}
.goog-te-gadget .goog-te-combo {/*personaliza o texto selecione o idioma*/
color: #fff;/*cor do texto*/
font-family: 'Delius Swash Caps', cursive;/*tipo da fonte*/
font-size: 14px;/*tamanho do texto*/
text-align: center;/*alinhamento*/
background: #FFAEB9;/*cor do plano de fundo*/
border-radius: 10%;/*borda arredondada*/
border: none;/*sem borda*/
text-shadow: 1px 2px 3px #a1a1a1;/*sombra do texto*/
padding: 1px;
}
/****fim do tradutor****/

Se o seu tradutor ficar muito para a direita ou esquerda altere o seguinte valor que es´ta destacado: margin: 4px 40px. Para as cores você poderá verificar os códigos neste site.

O código está explicativo, altere os valores que julgar necessário.

Alterado tudo, salve e visualize.

Pronto! Seu Tradutor do Google está personalizado! Deixem comentários!


Compartilhe este post:

Postar um comentário

Não esqueça de deixar o seu comentário! Pode não parecer, mas um blogueiro vive de comentários e sugestões, faça a sua parte e deixe esta blogueira feliz!

Dicas:
- Deixe o link do seu blog/site, eu sempre dou uma olhada!

Regrinhas básicas:
- Por favor não usem palavras de baixo calão.
- Comentários desrespeitosos serão excluídos.

 
Copyright © Cantinho Geek. Designed by OddThemes