Creando una barra de navegación en Blogger

Después de buscar y buscar diferentes plantillas, noté que casi siempre entraban en conflicto dos detalles. Si la plantilla que me gustaba tenía una barra de navegación aceptable, la cual me hacía falta, entonces era muy estrecha o no se veía bien la fecha. En otras lo contrario... Así que empecé a leer un poco y sumando los consejos de algunos sitios en inglés más lo que conozco de HTML, logré dar con una solución, elige tu plantilla favorita, aquí le agregaremos la barra de navegación.

Claro que este es un ejemplo para texto sencillo, se pueden hacer maravillas como botones de colores y esas cosas. Pero ya sería para bloggers más avanzados, que manejen CSS y esa no es la idea de esto. Ok, mucho blá blá... Empecemos con nuestro menú.

Primero que nada iremos a la pestaña "diseño" en el panel de control de nuestro blog y seleccionaremos Editar HTML, antes de cualquier cosa, haremos click en "descargar plantilla completa" y guardaremos ese archivo, por si acaso algo no sale bien. Hecho esto iremos al editor HTML que aparece más abajo y buscaremos estas líneas
<div id='header-wrapper'> <b:section class='header' id='header' maxwidgets='1' showaddelement=' no'>
Ahí, cambia el valor "maxwidgets a '3' y el showaddelement a 'yes'.

Ahora bajaremos un poco hasta encontrar esto
<div id='main-wrapper'><b:section clas='main' id='main' showaddelement=' no'>
  Y de nuevo cambiaremos showaddelement a 'yes'.

Ya hecho lo anterior, cambiaremos otra línea de código, que está más abajo y se parece a esta
<div id='content-wrapper'> <div id='crosscol-wrapper' style='text-align:center'> <b:section class='crosscol' id='crosscol' showaddelement=' no'/></div>
Este shoaddelement, al igual que los anteriores, lo cambiaremos a 'yes' y guardaremos la plantilla.

Ahora haremos click en Elementos de la Página y podremos ver que ahora tenemos la posibilidad de agregar un nuevo elemento entre la cabecera del blog y nuestros posts. Ahí agregaremos un nuevo elemento HTML y en el escribiremos todos los vínculos que queremos, separándolos como mejor nos parezca; barra vertical, juego de puntos, como nos guste más... Un par de ejemplos serían:

Separado por barras:
<a href="tudireccionuno">Dirección uno</a> |
<a href="tudirecciondos">Dirección dos</a>
O separados por puntos:
<a href="tudireccionuno">Dirección uno</a> .:.
<a href="tudirecciondos">Dirección dos</a>
Y ya está... Guardan sus cambios y listo! Podrán tener una barra de navegación en su blog igualita a la que encabeza el mio!

0 opinaron:

Publicar un comentario en la entrada