A partir de la versión 1.3.0, Astra permite añadir imágenes de fondo a varias secciones del sitio.
Puede mejorar el diseño del Cuerpo, Cabecera, Contenido, Barra lateral y Pie de página de su sitio web con esta opción. Además de la opción de color de fondo anterior ahora se puede ver la opción de imagen de fondo también.
¿Dónde puedo encontrar la opción?
Desde el panel de control de WordPress, vaya a Apariencia > Personalizar y en varias áreas, encontrará opciones para cargar imágenes de fondo
¿Dónde puedo añadir una imagen de fondo al tema Astra?
Con el tema Astra, tienes la opción de añadir una imagen de fondo a las siguientes áreas-
Cuerpo: Para añadir una imagen de fondo en el cuerpo del sitio web, navegue hasta Apariencia>Personalizar>Global>Colores. Desplácese hasta Antecedentes. Tendrá 3 opciones diferentes como Color, Gradiente e Imagen. La opción de color le permite seleccionar un color estático como fondo del sitio. La opción Degradado le permite elegir múltiples colores como fondo de su sitio. La opción Imagen le permite seleccionar cualquier imagen como fondo del sitio.
Widgets de pie de página: Para seleccionar un fondo en los widgets de pie de página, vaya a Apariencia>Personalizar>Constructor de pie de página. Haga clic en el botón icono de engranaje como se muestra en la siguiente imagen. Navegue hasta el Ficha Diseño y desplácese hasta el Fondo opción. Puede elegir un único color, un color degradado o una imagen como fondo del widget de pie de página.
Barra de pie de página: Para añadir un fondo a la barra de pie de página que se encuentra básicamente como la parte inferior de los widgets de pie de página, por favor, vaya a Apariencia>Personalizar>Footer Builder. Haga clic en el botón icono de engranaje como se muestra en la siguiente imagen. Navegue hasta el Ficha Diseño y desplácese hasta el Fondo opción. Puede elegir un único color, un color degradado o una imagen como fondo del widget de pie de página.
Imagen de fondo de los módulos Astra Pro
Además de la sección Body, Footer Widgets, Footer Bar, tiene la opción de los siguientes módulos de Astra Pro -
Cabecera principal: Para añadir un fondo a la cabecera principal, vaya a Apariencia>Personalizar>Creador de cabecera. Haga clic en el botón icono de engranaje como se muestra en la siguiente imagen. Navegue hasta el Ficha Diseño y desplácese hasta el Fondo opción. Puede elegir un solo color, un color degradado o una imagen como fondo de la cabecera principal.
Cabecera superior: Además de la cabecera principal, también puede añadir un fondo a la sección de cabecera anterior. Navegue hasta Apariencia>Personalizar>Creador de encabezados. Haga clic en el botón Icono de engranaje como se menciona en la imagen de abajo para acceder a la sección de cabecera anterior. Vaya a diseño y desplácese hasta la pestaña fondo opción. Puede elegir un solo color, un color degradado o una imagen como fondo de la sección de encabezado anterior.
Cabecera inferior: De manera similar, también puede cambiar el fondo de la sección de debajo de la cabecera.
Contenido de fondo: Para cambiar el fondo del contenido, tendrá que ir a Apariencia>Personalizar>Global>Colores. Desplácese hasta el Superficie Color y encontrará el contenido fondo color justo debajo del antecedentes del sitio. Como de costumbre, puede elegir un color estático, grediente o una imagen como fondo de los contenidos de su sitio web.
Fondo de la barra lateral: Sidebar en el sitio web de WooCommerce, juega un papel muy importante y es importante que se debe personalizar según la necesidad de sus clientes. Con el fin de cambiar el fondo de la barra lateral, por favor vaya a Apariencia>Personalizar>Barra lateral. Navegue hasta Diseño y verá la pestaña Color de fondo en la parte superior de la página, en la opción de colores. Usted puede elegir un color estático, gredient o una imagen como el backgroun de los contenidos de su sitio web.
Nota: La opción de fondo puede ser visible sólo si tiene Módulo Colores y fondo activado desde Astra Pro. Además, la configuración no funciona, si usted tiene un encabezado transparente activado en su sitio. Para obtener más información sobre el color de fondo de la cabecera transparente, consulte lo siguiente documento. Si no está seguro de lo que es una cabecera transparente, consulte el documento aquí.
Opciones para la imagen de fondo
La opción Imagen de fondo le permite elegir una imagen de la biblioteca multimedia o puede cargar un nuevo archivo. Después de subir la imagen, haz clic en la opción Más ajustes. Ahora puede establecer las siguientes propiedades CSS para la imagen -
- Repita
- Posición de la imagen de fondo
- Tamaño del fondo
- Antecedentes
Puede ajustar la superposición del color de fondo con el selector de color. Una bonita capa transparente de color sobre la imagen realzará el diseño de la imagen de fondo.
Notas importantes:
- Después de añadir una imagen de fondo, asegúrese de ajustar la opacidad del color de fondo con el selector de color.
- El fondo aplicado al cuerpo no será visible para Ancho total/ Estirado - Disposición del contenedor ya que en este diseño la anchura del contenedor se estira al máximo.
