Menu para Afiliados

Bom Dia! Como estão? Hoje trouxe um tutorial que acho bem útil para quem possui afiliados no blog e gostaria de dar um "estilo" à este gadget. Neste tutorial iremos começar a usar o novo editor de HTML. Quando olhei de primeira achei bem complicadinho, mas é bem fácil de se usar. Ao longo do post irei explicando o que vocês devem fazer para encontrar os códigos, ok? Para verem como é o efeito clique aqui>> Prévia, e vá até o gadget Efeito para Afiliados. Bora pro tutorial? GO!

Para começar vocês devem procurar por ]]></b:skin> e colar acima dele o seguinte:

.rodaesobe{

-webkit-transition: 0s linear;

-webkit-transition: opacity 0.5s linear;

-webkit-transition: all 0.3s linear;

-webkit-transition: all 0.3s linear;

-moz-transition: all 0.3s linear;

transition: all 0.3s linear;

-webkit-transition-duration: 0.4s;

-webkit-filter: none; -webkit-transition:all 1s ease;padding: 3px;}

.rodaesobe:hover{

-webkit-transform: scale(1.20);

-moz-transform: scale(1.20);

-webkit-transform: rotate(360deg);

-moz-border-radius: 50px;

-webkit-border-radius: 50px;

padding: 3px;

-webkit-filter:grayscale(1);

-webkit-transition:all 1s ease;}

Mas Ingrid, eu não consigo achar esse código no novo editor. Para você conseguir encontrar o código, você deve dar um clique dentro da área do HTML, colar o código e dar um Enter no seu teclado.  (EX).

Feito isso, abra um gadget de JavaScript e cole o seguinte:

<a href="Link do blog" title="Nome do blog"><img src="Link da Imagem" class="rodaesobe" /></a>

<a href="Link do blog" title="Nome do blog"><img src="Link da Imagem" class="rodaesobe" /></a>

<a href="Link do blog" title="Nome do blog"><img src="Link da Imagem" class="rodaesobe" /></a>

Neste post, eu fiz algumas imagens para afiliados para vocês usarem se quiserem.