Tutorial {Menu cuadrado con bordes}

Hola!, hoy les trago este tutorial para colocar tu menú personalizado, pueden ir probando en su blog si les interesa, la verdad es que considero este menú muy bonito, ya que le puedes cambiar los colores, bordes efectos y demás. Espero que les guste :)

1. Vamos a Plantilla > Editar HTML
2. Buscamos (con Ctrl + F) <b:skin> y le damos clic a los puntos suspensivos de la derecha
3. En ese texto vas a tener que buscar: 

/* Content

• Abajo vas a poner este código:

#PameMenu{
list-style-type: none;
margin: 0px;
padding: 0px;
width:50px;
letter-spacing:2px;
text-decoration:none;
font-family:verdana;
font-size:10px;
color: #fff;
border:2px solid #fff;text-align:left;
background:#FFE4E4;border-radius:0px;
color: #000;
text-decoration: none;
display: orizontal;
padding: 10px 10px 10px 20px;
}
#PameMenu:hover {
background:#DAF1FF;border:2px solid #fff;-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}

• Es el ancho del borde del menú, el tipo de borde y el color del borde
• Es el color del menú al pasar el cursor
• Es el color del menu que cambia al pasar el cursor

     7. Luego vas a Diseño y después agregar HTML/Javascript el sigueinte codigo:

<a id="PameMenu" href="url de la categoria" title="TITULO">TITULO</a>
<a id="PameMenu" href="url de la categoria" title="TITULO">TITULO</a>
<a id="PameMenu" href="url de la categoria" title="TITULO">TITULO</a>
<a id="PameMenu" href="url de la categoria" title="TITULO">TITULO</a>

• Si quieres agregar otra seccion o categoria, agrega esta linea:

<a id="PameMenu" href="url de la categoria" title="TITULO">TITULO</a>

• Y ahora solo tienes que editarlo a tu gusto, lo guardas, y ya.

Antes de irme voy a tomar en cuenta sus opiniones respecto a mi nueva firma: (quiero que me digas en los comentarios cual es la que mas os gusta)

 Bye! los veo...