Tutorial: Menú sweetheart

¡Holaaa! Que onda? Yo bien, pero con calor :( pero gracias al cielo existe algo llamado aire acondicionado xD. Hoy les traigo el tutorial sobre el menú que tengo ahora mismo en el blog xDD Créditos a Miki por el! Les dejo la imagen y un preview por si acaso ^^

Live preview




Paso 1

Editar en HTML

Plantilla | Editar HTML | CTRL + F y buscas:

]]></b:skin>

Y arriba de ]]></b:skin> pegas lo siguiente:

menu2{
background-image: url(URL IMAGEN DE FONDO);
font-family: Georgia;
color:#fff;
outline-offset: -3px; outline: 1px solid #fff;
font-size: 10px;
letter-spacing: 3px;
text-transform: lowercase;
font-style: italic;
padding: 3px;
margin-right: 3px;
margin-bottom: 3px;
text-align:center;
text-decoration:none;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
float: left;
width: 106px;
height: 15px;
text-shadow: 0px 0px 0px #fff;
-webkit-transition-duration: .20s;
}
menu2:hover{
letter-spacing: 1px;
opacity: .70;
-webkit-transition-duration: .20s;
}

Editamos:

Rojo: url del fondo del menú

Azul: Tipo de fuente

Rosa: Medida de separación de las letras

Verde: el formateo de las letras: puede ser italic, bold, inserted o deleted. Dependiendo tu gusto cambias el <<italic>> por alguno de los anteriores :)

Paso 2

Añadir el menú en un gadget.

Diseño | Añadir gadget | HTML o Javascript

Copias y pegas:

<a href="LINK" title=""><menu2>NOMBRE</menu2></a>
<a href="LINK" title=""><menu2>NOMBRE</menu2></a>
<a href="LINK" title=""><menu2>NOMBRE</menu2></a>
<a href="LINK" title=""><menu2>NOMBRE</menu2></a>
<a href="LINK" title=""><menu2>NOMBRE</menu2></a>

 Está todo indicado ^^



Eso es todo! Espero que se haya entendido, si tienen alguna duda, como siempre, no duden en preguntarme en los comentarios :D

Antes de irme quiero invitarlos a que participen de la iniciativa que hizo Bleiÿ "Intercambio de regalos navideño" La verdad me pareció una genial idea y seria aún más genial que se unan para que seamos más participantes y la iniciativa más emocionante :)
Click en la imagen!


Chaaaus cx