Añadir separadores entre las entradas en Blogger


Jéssica de Diversidad y variadas explicó de forma excepcional cómo poner separadores entre las entradas (post) de nuestros blogspots. Estos separadores son conocidos como dividers y son muy útiles para llevar un correcto orden y claridad en el blog.

Para saber a lo que me refiero puedes ver este ejemplo:

Dividers Blogger


Para añadir este tipo de separadores en tu blog deberás hacer lo siguiente:

1) Ves a Diseño
2) Edición de HTML
3) Busca en tu plantilla el código .post { (teclea Ctrl + F para buscar más rápido)
4) Te encontrarás algo así (depende de tu plantilla):

.post {
margin:.5em 0 1.5em;
padding-bottom:1.5em;
}

5) Antes del final, concretamente antes de }, añade el siguiente código:

background: url(AQUÍ-URL-IMAGEN-SEPARADOR);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:2.5em;

6) En definitiva debería quedarte algo así:

.post {
margin:.5em 0 1.5em;
padding-bottom:1.5em;
background: url(http://www.AQUÍ-URL-IMAGEN-SEPARADOR.jpg);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:2.5em;
}

En http://www.AQUÍ-URL-IMAGEN-SEPARADOR.jpg pon la URL de la imagen que quieras poner como separador. En leehansen encontrarás varios de libre uso.

8) Por último clica en vista previa y si todo está a tu gusto guarda tu plantilla. Espero que sea de tu agrado.




Recuerda que también puedes decorar tus entradas con los siguiente trucos que ya os expliqué anteriormente:


14 comentarios:

  1. ola, miren me encanta su blog. Leo todos sus archivos y sus posts y me parecen de lo mas claros y mas interesantes.

    Ayer lei varias entrevistas que haceis a los blogers y bueno, me gustaría (si se puede) que entrevistaseis a Jaime del balcon de Jaime y a Rosa del escaparate de Rosa.

    Creo que a mucha gente le puede interesar saber algo mas.

    Gracias y sigan asi.

    ResponderEliminar
  2. Una pregunta, estoy queriendo monetizar un poco mi blog y poner un poquito de publicidad entre las entradas, adsense me permite hacer eso pero solo con sus productos, queria saber como abrir espacios entre mis entradas como hace adsense para poner publicidad.
    Desde ya muchas gracias y ya los estoy enlazando a mi sitio porque me fueron de gran ayuda desde el principio

    ResponderEliminar
  3. Hola, nuevamente te felicito por tu blog, sin duda ayuda mucho y es imprescindible para todos aquellos que se inician en blogger.

    Te escribo porque tengo un problema con mi blog http://worldeportes.blogspot.com

    El detalle esta en que al publicar las entradas no hay separación de espacios en el post que he escrito, aunque al escribir y ver imagen previa sale bien, pero al publicarlo se ve el problema. Es más, trato de arreglarlo manualmente, parece que esta bien, pero al publicar nuevamente sale todo junto. A que se puede deber este problema???

    De antemano agradezco tu respuesta. Saludos

    ResponderEliminar
  4. Hola Janhio. Imagino que tu problema es cuando entras dentro de una entrada.

    Cuando la redactes y vayas a finalizar puedes optar por separar los párrafos colocando saltos de lína <p></p> o párrafos <br></br> , ello tendrás que hacerlo en el modo HTML (opción de la propia arriba a la izquierda) y colocar esos códigos donde quieras que haya un salto o párrafo.

    No sé darte otra solución, coméntame si haciendo lo que te digo te funciona.

    Saludos!

    ResponderEliminar
  5. Si brother, ya está. En configuración hay una parte donde indica usar párrafos br br automatizado, ahi estaba el problema. Gracias por la ayuda, me diste una luz sin duda. Saludos

    ResponderEliminar
  6. Me explicaré mejor, entramos a configuración, de ahí le damos en formato, ya dentro nos encontramos con "convertir saltos de línea", aqui debe decir "si" para que haya la separación de espacios. Aqui estaba mi falla. Pero sin duda sin la luz que me diste no encontrana este problema. Saludos

    ResponderEliminar
  7. Me alegro que esté solucionado Janhio.

    Un saludo y ahora... ¡a bloguear!

    ResponderEliminar
  8. por finnnnnnnnnnnn, he conseguido poner el separador, muchísimas gracias.

    ResponderEliminar
  9. hola he intentado poner separadores pero no lo consigo o no se me podeis ayudar gracias

    ResponderEliminar
  10. ya lo consegui pero tambien quisiera aver si podeis ayudarme, he cambiado la plantilla por otra y ahora me salen dos entradas en el blog identicas como puedo quitarlas

    ResponderEliminar
  11. hola mi pregunta esla siguiente..
    Como hago para que cada ves que publique una entrada aparezcan separadas una de otra (osea que entre cada entrada aparezca el fondo del blog) como en una caja encasilladas, asi me salio una vez y se ve muy bien pero ya despues aparecen siempre juntos el fin y el principio d emis entradas, eso confunde mucho y no me agrada.

    ResponderEliminar
  12. Bueno, esta muy bien y e echo esactamente lo que dice pero... ¡¡ no me sale!!
    Creo que el problema está en que mi código no es igual al que tu pones... no tiene nada de 1.5 así que por tanto no creo que sirva... y no sé como hacerlo :S

    ResponderEliminar
  13. Excelente! gracias por el tutorial :D

    ResponderEliminar
  14. ups!! intente hacerlo pero no me salio, quiza porq tiene nueva imagen ahora el blog :(

    ResponderEliminar