30 enero 2013

Editar la Navbar!

Pa' empezar. ¿Qué es la Navbar?
Bueno, pues esa odiosa barra en la parte de arriba de tu blog. Ok, es útil, estoy de acuerdo, si eres vago y no te gusta entrar desde blogger XD


Bueno, pues para los que la odian (o simplemente están cansados de ella), les traigo tres formas de editarla^^. 

* Deshacerse de la Navbar.
¡Fuera Navbar!

1.- Vayan a Edición > Editar HTML.
2.- Aprietan Ctrl + F. Les saldrá una ventaba y buscan esto:

<b:widget id='Navbar1' locked='true' title='Barra de navegación' type='Navbar'/>

3.- Bórrenla y guarden. Les saldrá una leyenda de advertencia. Ignórenla, denle a "Eliminar Gidgets" (:

* Efecto desvanecer la NavBar.
O sease que la barra no se verá, pero aparecerá cuando pasen el puntero por encina ;)

1.- Igual (sin borrar la Navbar; ese ya fue un trabajo pasado. Este es otro), vayan a Edición > Editar HTML.
2.- Ctrl + F. Buscan ]]></b:skin>
3.- Justo arriba, pegan esto:

/*--COMIENZO efecto desvanecer Navbar by Eveletta
-----------------------------------------------------------------------------*
#navbar-iframe {
opacity:.0;
filter:alpha(Opacity=0,FinishedOpacity=0);
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
#navbar-iframe:hover {
opacity:1.0;
filter:alpha(Opacity=100,FinishedOpacity=100);
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
/*-- FINAL efecto desvanecer by Eveletta --*/


* Cambia los colores de NavBar.
Con esto le da una apariencia más estética al tener los mismos colores del blog ;)

Digamos que su plantilla es... rojo con verde chillón (Esto sólo es un ejemplo, pueden cambiar a los colores que ustedes quieran o.o XD) y quieren que su barra sea del mismo color verde chillón y que cambie a rojo cuando pasen el puntero por encima.

1.- Ir a Edición > Editar HTML.
2.- Ctrl + F. Buscan ]]></b:skin>
3.- Justo arriba, pegan esto:

/*--COMIENZO efecto colores Navbar by Eveletta
---------------------------------------------------------------------------*
#navbar-iframe {
background:#00FF00; /* COLOR FIJO */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
#navbar-iframe:hover {
background:#9F0002; /* COLOR CUANDO PUNTERO */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
/*-- FINAL efecto colores by Eveletta --*/

Si no saben cómo obtener el código de los colores deseados, pueden ir {aquí} y obtener el número del color deseado (:
Espero les sea de ayuda ^^

(P.D. Ahora pueden seleccionar el texto del blog, pero para copiar los códigos deben apretar Ctrl+C, el mouse no funciona :c)

5 comentarios:

  1. En uno de los blogs de ayuda leí que por ningún motivo hay que borrar la navbar. Genera muchos problemas.
    Lo mejor es usar CSS, con un display:none se consigue lo mismo y es más seguro.
    Saludos :)

    ResponderEliminar
    Respuestas
    1. Yo no tengo navbar y no tengo (ni he tenido) ningún problema (:

      Eliminar
  2. Pero también se puede quitar directamente desde "Diseño", de esa forma no habría que usar tantos códigos, aunque, si que da pereza tener que entrar desde blogger T_T, pero, me gusta más como queda el blog sin NavBar ewe, gracias de todas formas por los consejos de programación html, no se me da nada bien usarlos ñ___ñ'

    Saludos! :)

    ResponderEliminar
  3. :3 apliicaré el ultimo... Muchas gracias Eve! Tu siempre tan linda con tus tutos! xD

    Besoos!!

    ResponderEliminar
  4. Hola!!! Te he dado un premio en mi blog!! xD me gustaría que vieras la entrada!!xD Besos!! http://newsyndrome.blogspot.com/2013/02/premio-al-blog-premio-los-siete-pecados.html

    ResponderEliminar

Los comentarios son bonitos, porque te hace saber que no hablas sola, sino que hay alguien allá, leyéndote, sin embargo, los comentarios con lenguaje inapropiado, o un spoiler sin sentido, no serán publicados.
Gracias.