Controla el color de fondo, el vídeo, la imagen y mucho más con los ajustes dentro de Advanced > Background.
Background Color
Establece el color de fondo del elemento.
Background Image
Establece una imagen para el fondo. Si la imagen no se puede cargar, se utilizará el color.
Puedes establecer la imagen de tres maneras:
- Especificar la URL de la imagen.
- Cargar o utilizar una imagen existente en la biblioteca multimedia de WordPress haciendo click en Browse
- Establecer la imagen de fondo en Datos Dinámicos, como la imagen destacada de la entrada, haciendo click en Data
Image Overlay Color
Si la imagen de fondo está configurada, puede oscurecer, aclarar y colorear la imagen.
Utiliza esta opción para asegurarte de que el texto colocado sobre las imágenes de fondo tiene suficiente contraste para ser fácilmente legible.
Utiliza el control deslizante de opacidad en la parte inferior del selector de color para ajustar la transparencia del color de superposición, asegurando que la imagen de fondo se vea a través.
Background Size
- auto - Utiliza la altura y la anchura originales de la imagen.
- cover - Escala la imagen para que cubra completamente el fondo del elemento.
- contain - Escala la imagen para que esté completamente contenida dentro del elemento.
- manual - Establece manualmente el ancho y el alto de la imagen.
Background Repeat
- repeat - La imagen de fondo se repite tanto vertical como horizontalmente.
- repeat-x - La imagen de fondo se repite sólo horizontalmente.
- repeat-y - La imagen de fondo se repite sólo verticalmente.
- no-repeat - La imagen de fondo no se repite. La imagen sólo se muestra una vez. Esta es la opción por defecto.
Background Attachment (Parallax)
- scroll - la posición de la imagen de fondo se fijará al elemento y se desplazará junto con el elemento y la página.
- fixed - la posición de la imagen de fondo se fijará al elemento y se desplazará junto con el elemento y la página.
Utiliza fixed para un efecto parallax.
Background Position (Left and Top)
Introduciendo los valores Top y Left se posiciona la imagen a estas distancias respectivas desde la esquina superior izquierda del elemento.
Background Clip
- border-box - el fondo se extiende hasta el borde exterior del elemento.
- padding-box - t el fondo se extiende hasta el borde interior del borde del elemento.
- content-box - el fondo se extiende hasta el principio del relleno del elemento.
Background Blend Mode
Los modos de fusión del fondo permiten establecer cómo debe mezclarse la imagen de fondo de un elemento con el color de fondo o el gradiente del elemento.
- Normal - No se aplica ninguna mezcla.
- Multiply - El color de fondo y la imagen de fondo se multiplican, dando como resultado una imagen más oscura que la original.
- Screen - Tanto la imagen de fondo como el color se invierten, se multiplican y se vuelven a invertir.
- Overlay - El color de fondo se mezcla con la imagen.
- Darken - Reemplaza las partes de la imagen que son más claras que el color de fondo con el color de fondo.
- Lighten - Sustituye las partes de la imagen que son más oscuras que el color de fondo por el color de fondo.
- Color-dodge - El color de fondo se divide por el inverso de la imagen de fondo.
- Color-burn - El color de fondo se invierte, se divide por la imagen de fondo y se vuelve a invertir.
- Hard-light - Las partes de la imagen de fondo que son más claras que el color de fondo se tratan como si tuvieran el modo de fusión "multiply", y las partes de la imagen que son más oscuras que el color de fondo se tratan como si tuvieran el modo de fusión "screen".
- Soft-light - Similar a "hard-light" pero con un aspecto más difuso.
- Difference - Los colores más oscuros de la imagen de fondo y el color de fondo se restan de los más claros. El resultado es una imagen de alto contraste.
- Exclusion - Similar a la diferencia, pero con menor contraste.
- Hue - El tono de la imagen de fondo se combina con la luminosidad y la saturación del color de fondo.
- Saturation - La saturación de la imagen de fondo se mantiene mientras se mezclan la luminosidad y el tono del color de fondo.
- Color - Mezcla el tono y la saturación de la imagen de fondo con la luminosidad del color de fondo.
- Luminosity - La luminosidad de la imagen de fondo se conserva mientras se utiliza el tono y la saturación del color de fondo.
ESTABLECER UN FONDO DE VÍDEO
Oxygen permite establecer un vídeo como fondo sólo para los elementos de la sección. Para establecer fondos de vídeo para otros elementos, utiliza el pluginVideo Background.
Video Background URL
El vídeo debe estar en formato de archivo .mp4 o .webm.
Puedes establecer el vídeo de dos maneras:
- Especificando la URL del vídeo.
- Subir o utilizar un vídeo existente en la biblioteca multimedia de WordPress haciendo click en Browse
Tip: almacena el fondo de tu vídeo en un servicio como Cloudinary para que se cargue rápidamente.
Hide Video Below
Para ocultar un fondo de vídeo por debajo de un determinado ancho de pantalla, seleccione el ancho de pantalla en la lista.
Los fondos de vídeo funcionan mejor en pantallas grandes, que suelen encontrarse en dispositivos de escritorio y portátiles con conexiones rápidas a Internet. Los usuarios de móviles suelen tener conexiones más lentas y, por tanto, no se recomienda utilizar un fondo de vídeo.
Video Overlay
Si el vídeo de fondo está configurado, puedes oscurecer, aclarar y colorear el vídeo.
Utiliza esta opción para asegurarte de que el texto colocado sobre el vídeo de fondo tiene suficiente contraste para ser fácilmente legible.
Utiliza el control deslizante de opacidad en la parte inferior del selector de color para ajustar la transparencia del color de superposición, asegurando que el vídeo de fondo se vea a través.
Última modificación: 20 de junio de 2020
