La verdadera historia de como conseguí quitar la barra de google en la nueva versión de blogspot
Era un gris y lluvioso día de primavera, los pajaros habían dejado de cantar, los truenos sonaban cada vez más fuertes y la barra de google planeaba desafiante sobre el template "Thisaway Green" de mi blog.
Decidido a acabar con ella recurrí a los sabios de la web para aconsejarme de como vencerla y hacerla desparecer para siempre, pero los antiguos trucos de poner las etiquetas <noembed></noembed> entre la etiqueta <body>, o manipular el css del identificador b-navbar, ya no funcionaban bien:
Esto funcionaba en la anterior versión beta de Blogger, en la nueva no:
#b-navbar {
height:0px;
visibility:hidden;
display:none
}
Esto no lo recomiendo, es mejor usar CSS:
<noembed><body></noembed>
Por si esto fuera poco, el identificador del iframe de la barra de google había cambiado en el nuevo Blogger y ahora se llamaba "navbar-iframe". Así que decidí usar mi ingenio e indicar los valores en las etiquetas de style apuntando a este nuevo identificador:
Este es el iframe de la barra de google:
<iframe src="#" marginwidth="0" marginheight="0" id="navbar-iframe" frameborder="0" height="30" scrolling="no" width="100%"></iframe>
Estilo CSS a indicar en la hoja de estilos o entre las etiquetas <style></style> para ocultar la barra de google en el nuevo Blogger:
#navbar-iframe {
height:0px;
visibility:hidden;
display:none;
}
Mi ataque surtió efecto, pero no como yo esperaba, ya que la barra de google había desaparecido, pero continuaba habiendo un espacio en blanco entre el comienzo de la ventana y la cabecera de mi blog. Parecía como si hubiera un margen definido, aunque el CSS del elemento body o del identificador "wrapper" (según el template el identificador puede cambiar, en algunos es content y en otros wrap) no había nada que indicase tal cosa, y tampoco directamente sobre los tags:
Esta es la primera capa del blog, la "caja" que lo contiene todo:
<div id="wrapper"></div>
Fue entonces cuando se abrió un rayo de esperanza en el cielo nublado y me dí cuenta de que había un enlace hacia una hoja de estilos llamada "classic.css" en un directorio con el nombre de "navbar". La llamada se hacía justo antes de cerrar la etiqueta head (</head>), por lo que pusiese lo que pusiese en el del documento entre las etiquetas <style></style>, prevalecería lo definido en esta hoja de estilos (prevalece siempre lo último definido en el orden de cáscada):
Código que introduce Blogger automáticamente para importar una hoja de estilos que es usada para colocar la barra de google. Hay que observar que @import es CSS2, por tanto esta llamada no funcionará en un navegador que no lo soporte:
<style type="text/css"><br />@import url(http://www2.blogger.com/css/navbar/classic.css);<br />div.b-mobile {display:none;}<br /></style>
Dentro de esa hoja de estilos, se define un margen superior de 30px para el identificador "wrapper" (templates Thisway p.ej.) y 34px para el identificador "wrap" (templates TicTac p.ej.), que es justo el problema que tenía:
/* for Thisaway, Moto */
body #wrapper {
margin-top:30px;
}
/* for No.897 */
body #wrap #wrap2 #header {
margin-top:0;
}
body #wrap {
margin-top:34px;
}
No me quedó más remedio que indicar un margen superior de cero píxels en la misma etiqueta <div> del identificador "wrapper" (recordad que este identificador varía según el template):
<div id="wrapper" style="margin-top: 0;"></div>
Esta herida mortal acabó definitivamente con la malvada barra de google y nunca más se supo de ella.
FIN
No hay comentarios:
Publicar un comentario