Menú vertical para tu blog de blogger (II)

Gracias a César he descubierto este otro menú vertical para blogger que aunque se parece al que ya os expliqué anteriormente se convierte en otra muy buena opción para tu blog.

¿Quieres ver este menú en movimiento? ¡Clic aquí!

Para instalar este menú debes hacer lo siguiente:

1) Vamos a Diseño
2) Edición de HTML
3) Busca ]]></b:skin> (teclea Ctrl + F para buscar más rápido)
4) Justo arriba de ]]></b:skin> pega el siguiente código:

/* Menu nav
----------------------------------------------- */

#nav,#nav li {
margin: 0;
padding: 0;
list-style: none;
}

#nav a {
width: 140px;
height: 27px;
background: url(http://img46.imageshack.us/img46/2955/menunav.gif) no-repeat;
color: #666;
display: block;
font: bold 12px/22px Arial, sans-serif;
text-decoration: none;
text-indent: 14px;
}

#nav a:hover {
background-position: 0 -27px;
color: #900;
text-decoration: none;
}

Código a copiar/pegar

5) Clica en vista previa y si no hay ningún problema, guarda tu plantilla.
6) Ahora ves a Diseño->Elementos de página->Añadir un gadget->HTML/Javsscript. En él pega el siguiente código:

<ul id="nav">
<li><a href="#">Título</a></li>
<li><a href="#">Título</a></li>
<li><a href="#">Título</a></li>
<li><a href="#">Título</a></li>
<li><a href="#">Título</a></li>
</ul>

Código a copiar/pegar

Sustituye cada # por el enlace de la entrada que quieras enlazar en este menú.

Si deseas añadir o eliminar enlaces en el menú, fíjate en la estructura. Elimina o añade esta línea:
<li><a href="#">Título</a></li>

¿Qué modificaciones puedes hacer? Pues poca cosa, a menos que decidas cambiar la imagen de fondo (http://img46.imageshack.us/img46/2955/menunav.gif) por otra que hagas. Debes tener en cuenta que si empleas otra imagen deberás adaptar el tamaño width (ancho) y height (alto).