Revista Blog

Cambia el Fondo de tu blog

Publicado el 29 enero 2014 por Lireth
Bueno en muchos tutoriales os dirán lo tipiquísimo de ir a Diseño, picar arriba en Diseñador de plantillas y que ahí cambiéis el fondo. Eso está muy bien para según qué plantillas…pero si queréis aprender a cambiar un fondo como hay que hacerlo, o sea tocando el código, yo os lo enseño.
Lo primero que tenemos que hacer es buscar un host para imágenes. El viernes pillé un cabreo importante porque yo usaba siempre imageshack pero resulta que dentro de 20 días es de PAGO (1$ al mes, poco sí, pero no me da la gana pagar nada). A ver aunque no pagues, si estas registrado te mantienen las imágenes que tengas subidas, pero yo no me fío, ya sé cómo va esto, te dicen que sí y al cabo de 2 meses te las borran. Paso.
Así que opté por hacer del blog un host de imágenes.
¿Cómo? Pues subiéndolas como si hiciera una entrada pero sin publicarlas, guardando el borrador porque en Blogger una vez subes las imágenes ya se quedan guardaditas.Ahora os explico cómo se hace.
Vais a Nueva entrada y ponéis las fotos que os interesen, en este caso para el fondo de vuestro blog.Cuando la tenéis ya puesta picáis arriba a la izquierda donde dice HTML y veréis el código:Cambia el Fondo de tu blog
Pues como veis en la imagen guardáis esa URL que os aparece ahí porque es donde el blog ha alojado la imagen.Muy bien, con esa URL guardadita, podemos cancelar la entrada o dejarla como borrador, total que ahora nos vamos a Plantilla y Editar HTML (no os olvidéis de la copia de seguridad antes de tocar nada y lo de siempre si no sabéis como se hace Curso y aprendiendo :P)
Bien una vez en el código HTML de nuestra plantilla desplegamos artilugios (no hace falta todos, solo el de < b:skin >.
Ahí buscaremos este segmento:
body {font: normal normal 14px Delius;color: #222121;background: #dfdede url(http://4.bp.blogspot.com/-TVUTSZgpKh0/UuMkjBf_diI/AAAAAAAABoA/qJwlEuH1pjI/s1600/fonsflors.jpg) repeat fixed bottom center;padding: 0 40px 40px 40px;}

Es el primero que os debería salir.Muy bien donde dice:
background: #dfdede url(http://4.bp.blogspot.com/-TVUTSZgpKh0/UuMkjBf_diI/AAAAAAAABoA/qJwlEuH1pjI/s1600/fonsflors.jpg) repeat fixed bottom center;

Cambiaremos lo que aparece entre paréntesis y pegaremos la URL que habíamos guardado de nuestra imagen.
Seguimos más abajo, encontraremos la misma URL que la que hemos sustituido:
.body-fauxcolumn-outer .cap-top {position: absolute;z-index: 1;height: 400px;width: 100%;background: #dfdede url(http://4.bp.blogspot.com/-TVUTSZgpKh0/UuMkjBf_diI/AAAAAAAABoA/qJwlEuH1pjI/s1600/fonsflors.jpg) repeat fixed bottom center;}

Esa que está entre paréntesis, también la cambiamos.Solo tenemos que cambiar estas dos, las que están dentro de .body y .body-fauxcolumn-outer .cap-top¿De acuerdo?
Hacéis una vista previa a ver si os gusta y ya está, no tiene ninguna complicación, solo es cambiar esas dos URL por la URL de vuestra imagen.
Disfrutad.Muah!Cambia el Fondo de tu blog
Cambia el Fondo de tu blog ¡Gracias por suscribirte! Muchos besos. ❀Lireth❀

Volver a la Portada de Logo Paperblog