Colocando un código en un gadget HTML podemos cambiar la imagen de fondo de nuestro blog sin necesidad de modificar nada más.

Después de pinchar sobre el modelo que nos agrade, solo tendremos que copiar el código que allí nos proporcionan y pegarlo en un gadget HTML.
El cambio será instantáneo.
Hay que tener en cuenta que esta web, y casi todas las que proporcionan este tipo de fondos, incluyen en el código un enlace a su web (incluso con imagen) que suele mostrarse en un lugar bien visible del fondo añadido.

Staci explica con todo detalle como colocar sus fondos desde el CSS de nuestra plantilla:
[1] Ir a Edición HTML de nuestro panel y localizar está parte del código:
body {
background:$bgcolor;
margin:0; color:$textcolor;
font:x-small Georgia Serif;
font-size/**/:/**/small;
font-size: /**/small;
text-align: center;
[2] Cambiar ese código por este otro:
body {
background:$bgcolor;
background-image:url(direct link);
background-position: center;
background-repeat:no-repeat;
background-attachment: fixed;
margin:0; color:$textcolor;
font:x-small Georgia Serif;
font-size/**/:/**/small;
font-size: /**/small;
text-align: center;
[3] Cambiar "direct link" (resaltado en naranja) por la url de la imagen del fondo que hemos escogido en el blog de Staci.

Además de esta forma podríamos usar no solo uno de los diseños de Staci sino también uno propio o cualquier imagen que nos agrade.
Solo habría que sustituir donde dice URL_DE_LA_IMAGEN por la url de la imagen de fondo en el código:
<script>document.write(unescape("%3Cstyle%20type%3D%22text/css%22%3E%0Abody%20%7B background: #FFFFFF url(URL_DE_LA_IMAGEN) repeat-x;background-position%3A%20center%3B%20background-repeat%3A%20no-repeat%3B%20 background-attachment %3A%20fixed%3B%20%7D%0A%3C/style%3E%0A%3Cdiv%20id%3D%22tag%22%20 style%3D%22position%3Aabsolute %3B%20left%3A0px%3B%20top%3A30px%3B%20z-index%3A50%3B%20 width%3A150px%3B%20height%3A45px%3B%22%3E%0A%3Ca%20border%3D%220%22/ %3E%0A%3C/a%3E%3C/div%3E%20"));</script>
En cualquier caso y dependiendo de la pantalla del ordenador desde donde se vea el blog, pudiera ser que nuestra imagen de fondo no ocupase todo el ancho de la pantalla.
Para prevenir un efecto no deseado, podríamos colocar un color igual o lo más aproximado al diseño de la imagen de fondo en:
body {
background:#DEB887;
Para prevenir un efecto no deseado, podríamos colocar un color igual o lo más aproximado al diseño de la imagen de fondo en:
body {
background:#DEB887;
Compartir Enlace
0 comentarios:
Publicar un comentario