miércoles, 14 de marzo de 2012

SEPARADORES EN NUESTRAS ENTRADAS

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:




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.

No hay comentarios:

Publicar un comentario