Si has intentado cargar una nueva plantilla para el blog en Blogger de un sitio distinto del oficial, puede que te haya ocurrido que la barra de navegación desaparece. Que no se muestra en esa nueva plantilla. En realidad, lo que hacen muchos de los diseñadores, es que la ocultan para que la estética de ese diseño concreto no sea obstaculizada por la barra de Blogger que no admite otra modificación que la elección de un color entre unos pocos.
La eliminación de esta barra puede ayudar en el diseño pero entorpece la edición del blog. Para poder editar, ya no tenemos un acceso directo desde el propio blog y hay que buscar caminos un poco enrevesados para acceder a la edición de nuevas entradas o de la configuración general del blog.
Vamos a intentar resolver este problema.
Como hemos comentado lo que hacen los diseñadores ajenos a Blogger es, normalmente, ocultar esta barra de navegación. Para volverla a mostrar, tenemos que encontrar este fragmento de código dentro de la parte de la cabecera (entre <head> y </head>)
Mostrar.
#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}
Una vez lo hayamos encontrado lo eliminamos.Guardamos los cambios en la plantilla y comprobamos que la barra de navegación vuelve a aparecer.
Ahora, ya puestos, vamos a hacer que esta barra aparezca o desaparezca según el deseo del visitante.
Para ello, colocamos este fragmento de código de nuevo en la parte de la cabeza, entre <head> y </head>
Ocultar.
<script type="text/javascript">
var showHeader=false;
function ShowHideNav()
{
showHeader=!showHeader;
var nav=document.getElementById("navbar-iframe");
if (showHeader)
{
nav.style.visibility="visible";
nav.style.display="block";
}
else
{
nav.style.visibility="hidden";
nav.style.display="none";
}
}
</script>
<style type="text/css">
#navbar-iframe {
visibility: hidden;
display: none;
}
</style>
Este fragmento lo que hace es esconder momentáneamente la barra de navegación.var showHeader=false;
function ShowHideNav()
{
showHeader=!showHeader;
var nav=document.getElementById("navbar-iframe");
if (showHeader)
{
nav.style.visibility="visible";
nav.style.display="block";
}
else
{
nav.style.visibility="hidden";
nav.style.display="none";
}
}
</script>
<style type="text/css">
#navbar-iframe {
visibility: hidden;
display: none;
}
</style>
Lo que hacemos ahora es colocar este otro fragmento de código en la columna lateral del blog para que sea como un botón que muestra/oculta esta barra de navegación.
Mostrar/ocultar.
<span style="cursor:pointer;" onclick="ShowHideNav();">
Mostrar/ocultar la barra de navegación
<a style="visibility:hidden;" href="http://derya-webresource.blogspot.com"></a>
</span>
Dentro de Diseño > Elementos de página > Añadir un gadget que tiene que ser del tipo HTML/JavascritMostrar/ocultar la barra de navegación
<a style="visibility:hidden;" href="http://derya-webresource.blogspot.com"></a>
</span>
En este blog se ha añadido este código en la parte superior de la columna lateral izquierda. Pulsa sobre él para ver su funcionamiento.
4 comentarios:
Muchísimas gracias por tu aportación, Ángel.Me resulta una ayuda muy valiosa. Lo cierto es que las plantillas que no están en Blogger son mucho más vistosas, pero es más incómodo trabajar con ellas. De esta manera salvamos esa dificultad.
Pues a mi me tocó que ahora para ocultar la barra de navegación, simplemente colocan la altura a cero pixeles con esta instrucción:
#navbar-iframe{height:30px}
Para volver a verla, le he dado un valor de 30 px, que el tamaño adecuado para mostrarla.
Hola, gracias por tu ayuda fue de gran utilidad para mostrar la barra, tengo una pregunta, resulta que la plantilla que uso tiene un color de letra para las entradas la cual se pierde en el fondo, quisiera saber en que lugar puedo oscureser dicho color, Gracias
Hola, muchas gracias!! Al fin pude solucionar el problema! Gracias!!
Publicar un comentario