Tutorial-Menu de Tags Personalizado

Oiii, finalmente vou postar uns tutoriais, esse de hoje vai ser para fazer um menu de tags que  tem um efeito bem legal!

Vamos lá:

Caso alguma coisa aconteça, salve seu template primeiro(Modelo->Fazer Backup/Restaurar->Fazer Download do Modelo Completo)

1->Modelo->Editar HTML->Ctrl+F e procure por: ]]></b:skin>

2->Cole ANTES dessa tag o seguinte código:

/* Cute Menu

----------------------------------------------- */

#menuextra {

display : block;

font-size: 11px;

font-family: Tahoma;

letter-spacing : 0;

border-bottom : 1px dashed #CDB7B5;

background-repeat : no-repeat;

text-indent : 5px;

vertical-align : middle;

text-decoration : none;

line-height : 15px;

margin-bottom : 1px;

background : url( URL DO MINIGIF 1 AQUI) no-repeat left;

padding-left : 10px;

}

#menuextra:hover {

display : block;

text-decoration : none;

vertical-align : middle;

line-height : 15px;

border-bottom : 1px dashed #FF69B4;

background : url(URL DO MINIGIF 2 AQUI) no-repeat left;

padding-left : 10px;

}

Vamos alterar algumas coisas:

Onde está azul, é a cor da linha que ficara em baixo do nome quando o mouse ficar em cima do link, tabela de cores akii

Onde está vermelho é o mini gif, quando o mouse ñ está em cima do link, mude para o mini gif que quiser

Onde está verde é a cor da linha quando o mouse está em cima do link, consultar tabela de cores

Onde está rosa é o mini gif quando o mouse está em cima dele, mude para o que quiser

Depois salve!

Depois adicione um gadget HTML e coloque quantos links quiser por esse código:

<div id="menuextra"><a href="LINK AQUI">NOME DO LINK AQUI</a></div>

Xau, até o próximo tutorial!