*- Para ocultar la barra navbar hay varias formas, la mas utilizada es:
* Vamos a: La pestaña Diseño -> edición de HTML.
* Después en el código de nuestro blog, ponemos el siguiente código arriba de la etiqueta </head>:
<style type="text/css">
#navbar-iframe {height:0px; visibility:hidden; display:none; }
</style>
* Y guardar los cambios.
- También se puede tener oculta y poderla mostrar cuando queramos.
- Para tener la barra oculta y poderla mostrar mediante un link o botón, el cual se puede poner en la parte superior, en la sidebar o donde queramos.
*- Lo podemos hacer del siguiente modo:
* Vamos a: La pestaña diseño -> edición de HTML.
* Y ponemos el siguiente código arriba de la etiqueta </head>:
<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>
* Y guardar los cambios.
- Nota: Si ya teneis el anterior código cambiarlo (borrar el que teneis y poner este) o modificarlo.
*- Después de hacer lo anterior, agregamos el próximo código el lugar que prefirais.
* Si es en el sidebar (da igual si es el sidebar de la cabezara, lateral o cual sea, es indiferente).
* Vamos a: Diseño -> Añadir un gadget y elegimos HTML/Javascript, ahí colocamos el siguiente código:
<span style="cursor:pointer;" onclick="ShowHideNav();">
Mostrar / Ocultar Navbar
<a style="visibility:hidden;">
</a></span>
- Donde dice: Mostrar / Ocultar Navbar es el link que al presionarlo hacemos que aparezca y desaparezca la barra de blogger navbar.
- Podemos cambiarlo por otro texto o imagen.
- Para una imagen, cambiar Mostrar / Ocultar Navbar por <img src="URL de la imagen" />.
* Un ejemplo con imagen sería:
<span style="cursor: pointer;" onclick="ShowHideNav();">
<img style="width: 30px; height: 30px;" src="http://img708.imageshack.us/img708/9329/bloggernavbar.png" alt="Mostrar / Ocultar Navbar" />
<a style="visibility: hidden;"></a></span>
0 Comentarios:
Publicar un comentario en la entrada