Tutorial: Menu light

Oi dithingers!

Hoje eu trouxe um menu que pediram na Ask do blog que é um menu bem bonito e serve pra várias coisas. Eu demorei um pouco para achar ele, porem eu roubei do blog do meu irmão e ele nem vai ligar. 

Enfim, para a preview dele clica aqui. (www) O nome desse menu é Menu light e se quiser aprender a fazer ele clica em leia mais. 

Bom ele é muito fácil, o jeito de montar ele é que nem os outros menus, sem muito mistério ou segredo.. Vamos lá? 

Vá em Modelo → Editar HTML → Ctrl+F e procure pela tag: 

]]></b:skin>

Acima dessa tag você cola

kbr {

background:#fff; /* Cor de fundo do Menu */

width: 32%; /* Tamanho do Menu (Largura) */

text-align: center; /* Alinhamento do texto*/

font-size: 11px; /* Tamanho da fonte */

color: #87b1ff; /* Cor da fonte */

letter-spacing:1px; /* Espaço entre as letras */

padding: 3px;

margin: 2px;

float: left;

border-radius: 15px; /* Bordinhas */

border-top:1px #87afff dotted; /* Cor da borda*/

border-left: 1px #87afff dotted ; /* Cor da borda*/

border-right: 1px #87afff dotted ; /* Cor da borda*/

border-bottom: 1px #87afff dotted ; /* Cor da borda*/

-webkit-transition-duration: 1.0s; /* Tempo do Efeito */

}

kbr:hover {

background:#87afff; /* Cor do fundo do Menu ao passar o mouse */

width: 32%; /* Tamanho do Menu ao passar o mouse */

text-align: center; /* Alinhamento do texto a hover */

color: #fff; /* Cor da fonte ao passar o mouse */

letter-spacing:1px; /* Espaço entre as letras a hover*/

padding: 3px;

margin: 2px;

float: left;

border-radius: 5px; /* Bordinhas a hover */

border-top: 1px #3056a4 dotted ; /* Cor da borda a hover */

border-left: 1px #3056a4 dotted ; /* Cor da borda a hover */

border-right: 1px #3056a4 dotted ; /* Cor da borda a hover */

border-bottom:1px #3056a4 dotted; /* Cor da borda a hover */

-webkit-transition-duration: 1.0s; /* Tempo do Efeito */

}

Mude tudo que está em negrito. 

Depois é só salvar, agora você vai em Modelo e adiciona um gadget HTML/JavaScript 

e nele você cola:  

<a href="URL DA PAGINA"><kbr>NOME DA PAGINA</kbr></a>

Repetindo quantas vezes for usar e mudando o que está em negrito pelo o que se pede.

Espero que gostem e credite se usarem.