Gadget de anunciantes com efeitos css3

Bom galera ainda não falei em mometização de blog e nem vou falar muito, por motivos óbvios que é está começando agora e não tenho experiências neste assunto mas uma das melhores formas que já pude notar é os anunciantes direto, para conquistar esse tipo de anunciante não basta apenas entrar no Blogger ou qualquer outra plataforma e postar qualquer coisa, devemos conquistar cada um deles, isso começa primeiro com a aparença do seu blog por isso vou mostrar um gadget de anunciantes com efeitos em CSS3.

OBS: Recomendamos que faça um backup antes de mexer no código do seu template, caso ocorra algum erro terá como recuperá-lo evitando qualquer transtorno no final. 

Vamos o tutorial:

1º- Clique em Editar HTML e expandir modelos de widgets.

2º- Aperte Ctrl + F e procure por ]]></b:skin> e cole antes o  seguinte código.

.redondeado {
border-radius: 50%; /* Borda redondado */
box-shadow: 0px 0px 15px #000; /* Sombra */
padding:0;
border:0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.redondeado:hover {
box-shadow: 0; /* Com isso eliminamos a  sombra */
border-radius: 0; /* Com isso eliminamosa borda redondado */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}

3º- Layout →Adicionar um Gadgat→ HTml/Javascript e cole o  seguinte código onde deseja

<div class="ads">
<a href="URL BLOG" target="_blank" title="¡Espacio Disponible para tu Banner!"><img class="redondeado" src="https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg" /></a>
<a href="URL BLOG" target="_blank" title="¡Espacio Disponible para tu Banner!"><img class="redondeado" src="https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg" /></a>
<a href="URL BLOG" target="_blank" title="¡Espacio Disponible para tu Banner!"><img class="redondeado" src="https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg" /></a>
<a href="URL BLOG" target="_blank" title="¡Espacio Disponible para tu Banner!"><img class="redondeado" src="https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg" /></a>
</div>

 Em Azul ficará a URL do anunciante e em vermelho a URL da imagem ( recomendamos tamanho 125x125)

Agora salve.