Si bien es una barra que posee varias utilidades, la mayoría decide eliminarla por motivos estéticos y de otra naturaleza. Bien hoy vamos a ver qué podemos hacer con esta barra. Os ofrezco tres alternativas: ocultarla, eliminarla o personalizarla.
OCULTAR LA NAVBAR
Tenemos dos formas de ocultarlo:
1. Con el siguiente código no eliminaremos la navbar sólo la ocultaremos, es decir, no la veremos pero estará ahí. Un poco díficil de explicar con palabras pero cuando apliqueis el código verán a lo que me refiero. Para oculta la navbar hacemos lo siguiente :
♠ Vamos a Diseño/ Edición de HTML y Expandir plantillas de artilugios.
♠ Antes de body { pegamos el siguiente código:
#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}
2. La segunda forma de ocultar la navbar la ocultará parcialmente, es decir, la barra de navegación sólo será visible si pasamos el cursor sobre ella. Para ello, hacemos lo siguiente:
♠ Vamos a Diseño/ Edición de HTML y Expandir plantillas de artilugios.
♠ Antes de body { pegamos el siguiente código:
#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;
filter:alpha(Opacity=100,FinishedOpacity=100)}
ELIMINAR LA NAVBAR
Con el siguiente código, la navbar ya no estará en tu blog. Para elo seguimos los siguientes pasos:
♠ Vamos a Diseño/ Edición de HTML y Expandir plantillas de artilugios.
♠ Antes de <head> pegamos el siguiente código:
<style type="text/css">
#navbar-iframe {
height:0px;
visibility:hidden;
display:none;
}
</style>
PERSONALIZAR CON OTRA NAVBAR
Amtes que nada, debes de haber ocultado o eliminado la navbar de Blogger.Después puedes agregar otra navbar sencilla creado por ti mismo o crear una barra con menús desplegables .
Para el primer caso, que aplicó El Escaparate, podríamos hacer una sencilla barra con color y con algún texto, de bienvenida, por ejemplo. Para ello:
♠ Vamos a Diseño/ Edición de HTML y Expandir plantillas de artilugios.
♠ Después de <head> pegamos el siguiente código:
<div style=' background-color:#ffff60;
border-bottom: 1px solid #c00040;
margin: 0 0 5px 0;
padding: 4px 0;
font-size: 14px;'>
<img alt='BARRA' src='URL-de-la-imagen'
style='vertical-align: text-bottom;'/>
TEXTO-TEXTO-TEXTO
</div>
Para el segundo caso podríamos hacer una navbar con menús desplegables. Parece complicado pero no es así. Lo único que tenemos que hacer es crear una cuenta en NetworkBar Generator. Una vez creda la cuenta podremos diseñar la navbar, con colores , fuentes y añadiendo enlaces para el desplegable.
Una vez que tenga,os el código, para agregarlo a nuestro blog. hacemos lo siguiente:
♠ Vamos a Diseño/ Edición de HTML.
♠ Debajo de <body><div id='outer-wrapper'><div id='wrap2'> pegamos el código que nos den.
El resultado será el siguiente:
11 opinaron:
Muy bueno; no sabía cómo eliminar la navbar de mi blog.
Gracias
Me parece muy interesante la opción de personalizar la navbar.
Saludos :)
Ya lo agregue y oculté la molestosa navbar; ahora pienso usar esa navbar con menús :o
Un besote :D
Genial ;)
Es lo que buscaba
Besos
Yessmi: ahora sabes no sólo como eliminarlo, sino puedes ocultarlo o personalizarlo.
Saludos
Me parece muy buena la de ocultar que aparece cuando el mouse pasa. Creo que lo voy a aplicar a mi blog.
Un beso
Genial: espero que lo uses; es muy útil ;)
Saludos
hola, estoy usando una plantilla que me descargué, pero quiero agregarle la navbar que antes utilizaba con mi vieja plantilla blogger y no sé como hacerlo.
Soledad: en ambos blogs veo la navbar de blogger; quizás ya solucionaste el problema o, ¿tenías una navbar propia? me gustaría saberlo para poder ayudarte.
S@lu2
Muchas gracias, muy bueno tu blog,... saludos
http://ladyguapas.blogspot.com/
» Ladyguapas:
Gracias por tu visita!
S@lu2
Por favor, trata de tener habilitado tu perfil (has click en "Comenta con el antiguo editor" para iniciar sesión) o deja un enlace a tu blog escogiendo la opción "Nombre/URL", procura no dejar comentarios Anónimos.
Nota: Si es que se presenta algún problema con el formulario de comentarios, sólo has click en "Comenta con el antiguo editor"
Gracias por participar en el blog.