Botões css para Blogger

Aprenda como utilizar um botão css em vez de imagens, além de ser mais leve tem um aspecto mais profissional e caso venha trocar de template você pode modifica-lo, que a alteração será aplicada em todos os posts com ele. 

  Criar um botão css se tornou muito mais fácil e rápido com o site Button Maker do CSS-Tricks. 

  

1 - Acesse o site Button Maker;

2 - Personalize seu botão da forma que deseja (Confira a função de cada ferramenta na imagem 2);

3 -  Após personalizar seu botão, clique sobre o mesmo, e copie o código;

4 -  Para adicionar o código, vá para página Editar HTML e procure a linha ]]></b:skin> ;

5 - Acima dela cole o código que copiou do Button Maker;

Ps:  Caso deseje mudar a cor do link do botão e remover o sublinhado, adicione o código abaixo acima da linha ]]></b:skin> :

Ps²:  Na linha vermelha insira a cor que deseja;

.button a{

color:#fff;

text-decoration:none;}

.button a:hover{

color:fff

text-decoration:none;}

6 - Para usar o botão você deve entrar na parte HTML do post e colar a tag <div class="button"> acima do texto ou link que ficará dentro do botão e finalizar com a tag </div>. 

Exemplo:

<div class="button">  

 download

</div>

Resultará no botão:

download

Ferramentas do Button Maker (Imagem 2)

Fonte: fsmdesign.blogspot.com