Tutorial barra de navegacion para Blog

Aqui puedes encontrar un tutorial muy detallado sobre como colocar una barra de navegacion en tu blog. Es muy sencillo hacerlo, pero, de cualquier manera, el tutorial está ilustrado con imágenes para que cualquier persona lo pueda entender, aunque no tenga conocimientos previos al respecto.

<style type="text/css"><br /><style type="text/css"><br />/*Azul ////////////////////*/<br />#menu ul { margin:0; list-style:none;}<br />#menu li {display:inline;margin:0;padding:0;}<br />#menu a { float:left;background:url(http://i864.photobucket.com/albums/ab207/jose_vv/button_lefts.png) no-repeat left top;margin:0 1.5px 0 1.5px;padding:0 2px 0 8px;text-decoration:none;}<br />#menu a span {float:left;display:block; background: url(http://i864.photobucket.com/albums/ab207/jose_vv/button_rigth.png) no-repeat right top;padding:8px 12px 4px 6px;color:#fff;}<br />#menu a span {font: bold 12px Arial, Helvetica, sans-serif; color:#EFEBFA; float:none;}<br />#menu a:hover span {color:#fff;}<br />#menu a:hover {background-position:0% -27px;}<br />#menu a:hover span {background-position:100% -27px;}<br />#menu #current a {background-position:0% -27px;}<br />#menu #current a span {background-position:100% -27px;color:#fff}<br />.clear {clear:left}<br />/* Fin de Barra */<br /></style><br /><div><br /><div id='menu'><br /><ul><br /><li><a href='link_1'><span>CATEGORIA_1</span></a></li><br /><li><a href='link_2'><span>CATEGORIA_2</span></a></li><br /><li><a href='link_3'><span>CATEGORIA_3</span></a></li><br /><li><a href='link_4'><span>CATEGORIA_4</span></a></li><br /><li><a href='link_5'><span>CATEGORIA_5</span></a></li><br /></ul><br /></div><br /><div id="tag" style="position:absolute; left:4px; top:5px; z-index:50;width:172px; height:51px;"><br /><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img border=" 0" src="http://i864.photobucket.com/albums/ab207/jose_vv/back.gif" /><br /></a></div></div><br />

Si ya tienes un blog y quieres poner una barra de navegacion vas a ir a "Personalizar", "Diseño", "Elementos de la página" y Cliqueás en "Añadir un gadget"

Se te abrirá una ventana nueva con todas las opciones de gadget que proporciona blogger. La que vas a elegir es "HTML/Javascript"

Ahora debes ir a al cuadro de texto de la barra que elegiste y tienes que copiar todo el texto que se encuentra abajo de la imagen del mismo. Te conviene clickear con el botón derecho y elegir la opción "seleccionar todo" y recién ahi, copiar.
Una vez que está copiado, ya puedes pegarlo en el espacio en blanco de la ventana. Una vez que lo pegaste, tienes q cambiar donde dice CATEGORIA_# por el nombre de la categoria que quieres tener y en donde dice LINK_# pones el link de tu pagina con la etiqueta de la categoria (por ejemplo en la mia es http://softw-anime.blogspot.com/search/label/Tutorial, donde tutorial es la etiqueta), lo guardas y listo!!
Es en este momento cuando podés ver si te gusta como queda el fondo cliqueando en "Vista previa".
Si estás conforme, guardas los cambios.

Si quieres botones de otro color dejame un comentario y te los pondre. Leer más...

Manga Naruto Shippuden cap 497 Español

Leer más...

Fondos BackGround para Blogs 1

Estos fondos están preparados para ser usados con la plantilla Mínima que nos brinda blogger. Exclusivamente, para uso personal.
En un gadget de la página de diseño (parte derecha) debes pegar el código del fondo que elegiste.
Puedes cambiar las fuentes y colores para que combinen con el fondo.
NOTA:
Si la explicación te resulta insuficiente, puedes consultar el Tutorial detallado, que se encuentra justo abajo del título del blog.
Y cualquier duda, me dejás un comentario y trataré de ayudarte!

Fondo para Blog #1

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_1.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #2

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_2.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #3

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_3.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #4

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_4.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #5

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_5.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #6

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_6.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #7

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_7.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Si te gusta algún fondo y te lo llevás, no te olvides de comentármelo!
Leer más...

Fondos BackGround para Blogs 2

Estos fondos están preparados para ser usados con la plantilla Mínima que nos brinda blogger. Exclusivamente, para uso personal.
En un gadget de la página de diseño (parte derecha) debes pegar el código del fondo que elegiste.
Puedes cambiar las fuentes y colores para que combinen con el fondo.
NOTA:
Si la explicación te resulta insuficiente, puedes consultar el Tutorial detallado, que se encuentra justo abajo del título del blog.
Y cualquier duda, me dejás un comentario y trataré de ayudarte!

Fondo para Blog #8

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_8.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #9

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_9.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #10

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_10.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #11

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_11.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #12

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_12.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #13

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_13.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #14

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_14.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Si te gusta algún fondo y te lo llevás, no te olvides de comentármelo!
Leer más...

Fondos BackGround para Blogs 3

Estos fondos están preparados para ser usados con la plantilla Mínima que nos brinda blogger. Exclusivamente, para uso personal.
En un gadget de la página de diseño (parte derecha) debes pegar el código del fondo que elegiste.
Puedes cambiar las fuentes y colores para que combinen con el fondo.
NOTA:
Si la explicación te resulta insuficiente, puedes consultar el Tutorial detallado, que se encuentra justo abajo del título del blog.
Y cualquier duda, me dejás un comentario y trataré de ayudarte!

Fondo para Blog #15

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_15.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #16

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_16.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #17

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_17.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #18

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_18.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #19

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_19.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Fondo para Blog #20

<style type="text/css">body {background-image: url("http://i864.photobucket.com/albums/ab207/jose_vv/Fondos/BackGround_20.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><a href="http://softw-anime.blogspot.com/" target="_blank"><br /><img src="http://i864.photobucket.com/albums/ab207/jose_vv/BanBack.png" /></a>

Si te gusta algún fondo y te lo llevás, no te olvides de comentármelo!
Leer más...

Manga Naruto Shippuden cap 496 Español

Leer más...

Manga Naruto Shippuden cap 495 Español

Leer más...