Tecnología

Inicio

Cómo dar formato a una imagen de fondo para Blogger

Cómo dar formato a una imagen de fondo para Blogger


Un diseño o estilo único puede hacer que un blog se destaque de la competencia. Muchos sitios de blogs, como Blogger de Google, ofrecen a los usuarios la posibilidad de personalizar sus blogs a través de componentes pre-construidos. Fondos, por ejemplo, pueden mostrar diferentes colores o ninguno en absoluto. Si usted sabe cómo acceder a la plantilla de diseño de su blog, no sólo se puede utilizar las imágenes para su fondo, pero darles formato también. Esto le permite adaptar las características visuales de su blog con el contenido que usted comparte con el mundo.

Instrucciones

1 Iniciar sesión en su cuenta de Blogger, y haga clic en el enlace "Panel de control" en la parte superior de la página. Esta página muestra sus blogs actuales.

2 Haga clic en el enlace "Diseño" al lado de uno de los blogs. Aparece la página "Agregar y Organizar Elementos de página". Haga clic en el enlace "Editar HTML" en la parte superior de esa página. Un cuadro de edición aparece en la parte inferior de la página. Este cuadro muestra el código HTML de tu blog.

3 Busque la sección "Copia de seguridad / restauración de plantillas" en la parte superior de la página. Esta sección le permite copia de seguridad de su código HTML actual a una carpeta en su disco duro. Copia de seguridad del código asegura que tiene una copia de su original, en caso de que necesite para restaurarlo.

4 Haga clic en "Descargar plantilla completa", a continuación, haga clic en "Guardar archivo". Haga clic en "Aceptar" para guardar la copia de seguridad en su disco duro.

5 Desplazarse por el código HTML en el cuadro de edición en la parte inferior de la página. Busque el siguiente bloque de código:

bloque: body {

de las fuentes: $ (body.font);

color: $ (body.text.color);

fondo: $ (body.background);

}

Este código establece las características de visualización de fondo de su blog. Dado que este es el código HTML estándar, se puede cambiar del mismo modo que el código en cualquier otro documento HTML.

6 Eliminar ese bloque de código, y sustituirla por la siguiente:

cuerpo {

Imagen de fondo: URL ( 'http://www.mySite.com/myImage.jpg');

background-attachment: desplazarse;

background-repeat: no-repeat;

}

Reemplazar "http://www.mySite.com/myImage.jpg" con el URL de una imagen real en Internet o en el servidor Web.

7 Haga clic en "Vista previa" para previsualizar los cambios. Su entrada en el blog aparecerá en una nueva ventana o pestaña. El mensaje muestra la imagen de fondo que ha especificado en el código HTML. Desplazarse hacia arriba y abajo de la página. La imagen de fondo se mueve con la página porque se establece el valor de la propiedad background-attachment de "desplazamiento".

8 Volver al cuadro de edición de HTML, y localice el bloque de código que agregó. Eliminar esta línea:

background-attachment: desplazarse;

Agregue la línea siguiente en su lugar:

background-attachment: fijo

Haga clic en "Vista previa", y desplazarse hacia arriba y abajo de la página de nuevo. El fondo permanece fijo porque se establece el valor del atributo background-attachment a "fijo" en lugar de "desplazamiento".

9 Haga clic en "Guardar plantilla" para guardar los cambios.

Consejos y advertencias

  • Si elige una imagen de fondo que es más pequeña que la ventana del navegador, puede aplicar formato más enlosando su imagen de fondo. Hacer que al cambiar la palabra "no-repeat" a "repetir" en la última línea del bloque de código que agregó. Los navegadores se teja la imagen horizontal y verticalmente.