Configuración:
.
Biología
.
Botánica
.
Tecnología
.
Sociedad
A mis trece años de edad, el día 2 de Diciembre de 2007 inicié ‘El Balcón de Jame’. Este humilde espacio, cuyo secreto siempre fue el de compartir sin recibir nada a cambio, me dio la oportunidad de conocer un mundo nuevo, un entorno en el que me sentía yo mismo.

Hoy, 17 de abril de 2011 finalizo esta etapa de mi vida con una gran sonrisa y junto al recuerdo que este blog y cada unos de vosotros me habéis concedido.

He sido bloggero.

Jaime Trujillo Escobedo.

Menú vertical Neo

Trás haberos presentado el menú vertical Acua hace ya bastante tiempo, pensé en empezar a construír menús horizontales.

Desde hace unos días estuve ideando otro menú vertical ya que, según los comentarios que tuvo el artículo sobre la instalación del menú acua, resultaba muy atractivo y a su vez, útil.

De aspecto más elegante, el menú Neo puede introducirse en tu blog con unos sencillos pasos.


Menú vertical Neo para blogger tu blog


DEMO


Diseño>Edición de HTML>expandimos artilugios



Busca la etiqueta </head> e inserta este bloque de CSS encima:

<style>
#blmenu_neo {height:214px;width: 200px;margin: 10px;}
#blmenu_neo ul {list-style: none;margin: 0;padding: 0;}
#blmenu_neo li a {height: 32px;voice-family: "\"}\"";voice-family: inherit;height: 22px;text-decoration: none;}
#blmenu_neo img {border: none;}
#blmenu_neo li a:link, #blmenu_neo li a:visited {color: #000000;display: block; background:url("http://2.bp.blogspot.com/_gjBqKNTws4M/S-Xo7yrvxBI/AAAAAAAACXA/7srC7M7cOQ4/s320/blneo.png") repeat scroll 0 63px transparent;padding: 7px 0 0 30px;}
#blmenu_neo li{margin-top: -30px;}
#blmenu_neo li a:hover, #blmenu_neo li #actual {color: #000000; background:url("http://2.bp.blogspot.com/_gjBqKNTws4M/S-Xo7yrvxBI/AAAAAAAACXA/7srC7M7cOQ4/s320/blneo.png") repeat scroll 0 -34px transparent;padding: 7px 0 0 30px;}
</style>

Guarda la plantilla.


Diseño>añadir gadget (elemento de página)>html-javascript






Pega el código:

<div id="blmenu_neo"><ul>
<li><a id="actual" href="URL PAGINA INICIO">Inicio</a></li>
<li><a href="URL DE LA PAGINA">TITULO DEL ENLACE</a></li>
<li><a href="URL DE LA PAGINA">TITULO DEL ENLACE</a></li>
<li><a href="URL DE LA PAGINA">TITULO DEL ENLACE</a></li>
<li><a href="URL DE LA PAGINA">TITULO DEL ENLACE</a></li>
<li><a href="URL DE LA PAGINA">TITULO DEL ENLACE</a></li>
</ul>
</div>

Reemplaza en cada caso URL DE LA PAGINA por la dirección del enlace y TITULO DEL ENLACE por el téxto que aparecerá en la casilla.

Si deseas añadir más enlaces al menú, utiliza líneas como esta:

<li><a href="URL DE LA PAGINA">TITULO DEL ENLACE</a></li>

Y agrégalas siempre antes del cierre </ul>.

Por el contrario, para reducir el número de enlaces elimina alguna de dichas líneas.

Guarda el gadget para terminar y obtener así el menú Neo.

Mina dice...

Hola Muchas Gracias por compartir tantas ideas y diseños.
Estuve intentando, agregar las solapas arriba y la solapa neo. Pero no me salio :(
Donde decis insertar, tenemos que borrar algo o directamente lo pego ahi directo.

Jaime Trujillo Escobedo dice...

Estoy encantado de poder compartir todo esto, Mina. Al decir insertar me refiero a "pegar" pero no debe editarse o borrarse nada, salvo que lo mencione seguidamente.

En cuanto al menú en general, no encuentro errores :S, ¿Seguiste los pasos detenidamente?

Escribe tu comentario en la entrada...

El Balcón de Jaime fue terminado el 17 de abril de 2011. Leer despedida.

Me gustaría conocer tu opinión. El comentario será moderado y en breve se publicará.

Si deseas incluir un enlace utiliza este código:

<a href="Dirección de tu página">Titulo del enlace</a>

Para publicar un código haz uso del Conversor de entidades.

Intenta escribir sobre algo relacionado con el artículo. Si no lo haces, podría tardar en responderte.

¿Problemas al comentar? Utiliza el formulario antiguo