Como poner una barra separadora + Freebies

¡Hola bloggers!

Hoy os traigo un tutorial para bloggers facilisimo, vamos como todos jaja pero en este caso es un tutorial para poner la barra separadora de blogger, es decir una barra que separa un post de otro.

Para poner la barra separadora de blogger simplemente elegimos una de las imágenes que os he preparado:


Como poner una barra separadora + Freebies

Como poner una barra separadora + Freebies

Como poner una barra separadora + Freebies

Como poner una barra separadora + Freebies

Como poner una barra separadora + Freebies

Como poner una barra separadora + Freebies

¿No te gustan mis separadores? 

Jo me acabas de romper el corazón jaja pero bueno como sabia que esto podía pasar te dejo un enlace en el que vas a encontrar una que te guste si o si porque es que tienen unos separadores de barras monisimos y de uso libre.

El enlace es http://www.smashingmagazine.com/2008/09/09/the-hr-contest-results-download-your-fresh-hr-line-now/

Bien ya tienes un separador que te gusta ahora solo nos falta instalarlo, Si tienes una plantilla de blogger y nunca has cambiado nada vamos a blogger >> plantilla >>personalizar >> Avanzado >> Añadir Css y pegamos:


.post{
background: url(URL de la imagen);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 2.5em;
padding-bottom:3em; /*Para variar el espacio entre el separador y la entrada*/
}

Donde pone en azul La url de la pagina que quieras poner simplemente, para coger la url pinchas la imagen y le das a abrir url eso es lo que tienes que poner en la parte azul e guardamos y listo.

Si por el contrario tu plantilla no es de blogger, o si lo es pero has tocado ya la plantilla y no tiene los códigos iniciales vamos a Blogger>Plantilla>Edicion html.


2. Buscamos <b:include data='post' name='post'/> (Pulsa Cntrol + F para buscar) a veces cuesta mucho encontrarlo por lo que puedes borrar alguna parte del código para encontrarlo mejor por ejemplo así include data='post' name='post'

3. Cuando lo encontremos justo debajo pegamos: 

<center><img src='URL de la imagen'/></center>

En la parte azul ponéis la imagen que os gusta, le damos a vista previa y si todo esta correcto guardamos y listo.

¿Te gusta este tutorial blogger? ¿Vas a poner una barra separadora en el blog?

Melyssa Blog belleza y cósmetica

11 comentarios:

  1. Respuestas
    1. Probablemente es porque ya has modificado alguna vez la plantilla, he modificado el post para que las que no tenéis la plantilla inicial también lo podáis poner aunque lo tendrás que hacer desde la edición html, cualquier cosita no dudes en preguntar, besos

      Eliminar
  2. Yo estoy igual, no me aparece, que cosa extraña?

    ResponderEliminar
    Respuestas
    1. Te digo lo mismo que a LovingCosmetic guapa, besitos

      Eliminar
    2. El blog que tengo es nuevo, nunca le he cambiado nada en la plantilla, no entiendo porque no se aplican los cambios, y no se muestran, no lo veo por ninguna parte. Por cierto como se accede a la edición html?
      Gracias por respondernos, que tengas un buen día!!

      Eliminar
    3. Igual que de la otra manera vas a blogger>plantilla> y editar HTML. besos

      Eliminar
    4. Gracias, lo voy a intentar!
      Mil gracias de nuevo!

      Eliminar
  3. ayyy... y a mi que me parece dificil, pero tengo que intentarlo que estoy de reformas, gracias por compartirlo..bss

    ResponderEliminar
  4. Tengo que hacer cambios en el aspecto de mi blog, tendré estas barras en cuenta, me parecen muy prácticas.
    Besos!

    ResponderEliminar
  5. Me gusta, lo intentaré en mi blog a ver qué tal. Gracias!
    Besos!

    ResponderEliminar
  6. Yo ya había retocado la plantilla, y el segundo truco ha funcionado genial!!! Gracias!!! Un beso.

    ResponderEliminar