Diseña y publica tus sitios rápidamente

Cómo configurar un solo fondo para toda tu página

Fondo de página

La función de fondo de página te permite seleccionar un color o imagen para el fondo de toda la página. Se verá aun detrás de tus bloques. Puedes usar una sola imagen para todo el largo de tu página.

Bloques en una página

Un fondo de página se extiende a lo largo de toda la página y detrás de los bloques

Aquí verás una imagen en 3d de la página anterior para que entiendas mejor a qué nos referimos:

Imagen en 3d de la página de ejemplo

En esta captura puedes ver cómo los contenedores están sobre la página.

Cómo usarla

Encontrarás un vínculo al fondo de página en el dot de estilo de cada bloque.

El dot de estilo para el pie de página

Los dots de estilo de todos los bloques tienen el botón de "edit current page background" (edita el fondo de esta página).

Haz clic en él y se abrirán las opciones de estilo para ese bloque.

"Edit" en la opción de "Page Background" de un dot de estilo

Haz clic en "Edit" para obtener las opciones para el fondo de página.

Ahí verás diferentes opciones para el fondo de página.

Opciones para el fondo de página

Este es el panel de fondo de página.

Aquí repasaremos cada una de las opciones:

  1. Color de fondo (Background Color). Aquí puedes elegir un color sólido para el fondo.
  2. Imagen de fondo (Background Image). Puedes seleccionar una prediseñada o subir una propia.
  3. Combinar la imagen con el color de fondo (Blend Image with Background Color).  Al incrementar el porcentaje en esta opción, la imagen de fondo se mezclará con el color que elegiste en la primera opción. El límite máximo es de 75%.
  4. Forzar transparencia en los siguientes bloques (Force Transparency on the Blocks Below). Al marcar una casilla, estás haciendo transparente el fondo de ese bloque. Al elegir esta opción podrás ver el fondo de página sin importar el fondo del bloque.
  5. Degradado (Gradient). En la actualidad, los colores solamente se degradan hasta el negro.
  6. Sombreado (Drop Shadow). Esto genera un sombreado interno en el perímetro de la página.

Opciones para la imagen de fondo

Si seleccionas una imagen para el fondo, notarás que aparece un panel, como el de a continuación, a la derecha.

Opciones de la imagen de fondo

Al marcar la casilla de "Background Image" podrás editar las opciones en un panel nuevo.

Ahí podrás seleccionar una imagen de las que te ofrecemos. Hay muchas imágenes prediseñadas. Si tienes una imagen que quieras usar o diseñaste alguna, puedes hacer clic en  ”+Custom Image” para subirla. Solamente tienes que seleccionarla de tu computadora.

Después tienes las opciones de “repetición”. En la esquina superior derecha de este panel hay un menú desplegable con las opciones que tienes.

Opciones para las imágenes de fondo

Tienes varias opciones para repetir tu imagen de fondo

Puedes elegir una para cuando el largo o ancho de la página sea más grande que la imagen. Repetir el fondo puede ser muy útil por esas razones. Lo puedes hacer repetirse horizontalmente, verticalmente, de ambas maneras o que no se repita.

Los contenedores se quedarán sobre la página

Si necesitas “sobrescribir” el fondo de un bloque, resaltarlo o cambiarle el fondo, todavía puedes hacerlo. Los bloques están sobre la página, por lo que, todos los fondos de los bloques pueden estar visibles, “ocultos” o “cubriendo” el fondo de página.

Ejemplo de un fondo para la página

Esta imagen ilustra el fondo de una bloque puede estar sobre el fondo de página

Ocasiones en que puedes usarlo

Un fondo de página puede ser útil al diseñar una página que no es de un solo color (y aunque fuera de un solo color, es mucho más fácil definir el fondo de esta manera).

La siguiente imagen es un ejemplo:

El sitio de Push Up Charity

En lugar de elegir una imagen de fondo bloque por bloque, puedes usar una imagen para todo el fondo

Hay diferentes patrones y colores a lo largo de la página. En lugar de utilizar una imagen individual para cada bloque y hacer que empaten, puedes elegir una sola que se repita como mosaico u horizontal o verticalmente. ¡Es mucho más fácil!

¿Tienes alguna pregunta o comentario? Háznoslos saber en la sección de comentarios.