Cómo desaparecer la barra navegadora de blogger



Este es uno de mis trucos favoritos el cual aprendí en mi desempeño bloguístico. Pueden apreciar el resultado del útil código que les mostrare a continuación en la parte superior de nuestro blog, en la barra de blogger que es invisible.

La verdad es que hay otras maneras de desaparecer completamente la barra pero en lo personal encuentro que es súper útil dejarla, además así también nos podemos evitar problemas.

Vamos con los pasos a seguir...

Primero entra a tu cuenta de blogger y anda a la parte de diseño del blog. Una vez ahí vas a apretar en una de las cajas "Agregar Gadget", dentro de las opciones  encontrarás uno que dice HTML como se muestra en la siguiente captura.


click para agrandar


Luego tienes que pegar dentro del Gadget el siguiente código y hacerle click en guardar.

<!-- DROPDOWN NAVBAR -->
<!-- stylesheet for FF2, Op9, IE7 (strict mode) -->
<style type="text/css">
#navbar {
display:inline;
width:100%;
position:absolute;
background-color:transparent;
top:-30px;
left:0px;
height:60px;
z-index:999999;
}
#navbar:hover{
top:0px;
height:30px;
}
</style>
<!-- stylesheet for IE6 and lower -->
<!-- (not supporting element:hover) -->
<!-- first, unhide the navbar through css -->
<!-- second, hide the navbar and mimic -->
<!-- the effect with javascript, if available -->
<!--[if lt IE 7]>
<style type="text/css">
#navbar {
height:30px;
top:0px;
}
</style>
<script type="text/javascript">
var navbar = document.getElementById('navbar');
if(navbar){
navbar.onmouseover = function(){
navbar.style.top = '0px';
navbar.style.height = '30px';
}
navbar.onmouseout = function(){
navbar.style.top = '-30px';
navbar.style.height = '60px';
}
if (navbar.captureEvents){
navbar.captureEvents(Event.MOUSEOVER);
navbar.captureEvents(Event.MOUSEOUT);
}
navbar.onmouseout();
}
</script>
<![endif]-->
<!-- end dropdown navbar -->


Ahora tendrás tu barra invisible y puedes editarla en "Diseño" "Editar Barra de Navegación" y elegir entre las opciones que se muestran a continuación, a mi me gusta la trasparente, así no ensucia tanto el diseño de tu blog.


click para agrandar

Espero que les fuera de utilidad, nos vemos en otra oportunidad ;D 








CONVERSATION

5 ya son Blogger@s:

  1. Gracias, gracias! Con tus súper consejos mi proto-blog está quedando cada día más bello.

    ( y espero que estés tomándote más de 3 horas de sueño diarias, entre todo lo que haces no sé cuando duermes)

    ResponderEliminar
  2. jajajaj no duermo xD, es broma, no se y eso que siento que hay ene cosas que me gustaría aun por hacer

    Que bueno que te sirvió

    ResponderEliminar
  3. Your are awesome with your tutorials. I have learned a lot and using your methods is so easy. Thank you

    Tue eres fantastica con tus tutoreales. He aprendido mucho y usar tus metodos es muy facil. Gracias.

    ResponderEliminar
  4. Mil gracias fue de muchisima utilidad, hace un par de meses trate de eliminarla de otro forma mediante la plantilla html y fue un caboom... para mi blog.
    MUy util...

    ResponderEliminar

Todo comentario que no tenga relación con el post o sobrepase los límites de la libre expresión, será moderado y no saldrá publicado.

Back
to top