Editor de Wix Studio: cambiar el fondo de una sección
10 min de lectura
Diseña todas y cada una de las secciones según las necesidades de tu cliente. Puedes elegir un color, un degradado, una imagen o un video para el fondo de la sección. Agrega una superposición de texturas interesante y ajusta la opacidad para que el fondo no desvíe demasiado la atención del contenido.
Trabajar con breakpoints:
Puedes establecer el fondo de la sección por breakpoint, de modo que se vea de manera óptima en todos los dispositivos.
En este artículo, aprenderás a hacer lo siguiente:
Consejo:
Para acelerar el proceso de diseño, hemos creado un montón de secciones listas para usar y totalmente adaptativas en Secciones dentro del panel Agregar elementos.
Agregar un color al fondo de la sección
Elige cualquier color para el fondo de la sección, ya sea uno de los colores del tema o un color personalizado. Luego, puedes establecer la opacidad si prefieres un fondo más tenue.
Para cambiar el color del fondo de una sección:
- Selecciona la sección correspondiente.
- Haz clic en el icono Abrir Inspector profesional
en la parte superior derecha del Editor. - Haz clic en el cuadro de color debajo de Diseño.
- Según tus preferencias, selecciona un color:
- Colores del tema: elige uno de los colores de tu sitio.
- Mis colores: elige un color personalizado existente.
- Un nuevo color: haz clic en Agregar para añadir un nuevo color al selector de color.
- (Opcional) Usa el control deslizante para aumentar o disminuir la opacidad del color.
Agregar un degradado al fondo de la sección
El Editor de Wix Studio ofrece diferentes tipos de degradados para el fondo de la sección:
- Degradado radial, lineal o cónico
: elige hasta 8 colores y controla la opacidad de cada color en estos degradados. También puedes ajustar el ángulo (Lineal), el punto focal (Radial) o ambos (Cónico) para lograr el aspecto que deseas. - Degradado fluido
: este degradado te permite crear un efecto de malla, mezclando tantos colores como necesites. Puedes controlar la opacidad, el tamaño y la extensión de cada color individual en este degradado.
Para agregar un fondo de degradado a una sección:
- Selecciona la sección correspondiente.
- Haz clic en el icono Abrir Inspector profesional en la parte superior derecha del Editor.
- Haz clic en el cuadro de color debajo de Diseño.
- Según tus preferencias, haz clic a continuación para aprender a crear cada tipo de degradado:
Agregar un degradado lineal, radial o cónico
.
.
.
Agregar un degradado fluido
.
Agregar una imagen al fondo de la sección
Agrega una imagen al fondo de la sección y ajusta el punto focal para que siempre se muestre la parte correspondiente. Puedes usar tus propias imágenes cargadas, elegir una imagen gratuita de Wix/Unsplash o comprar una imagen de Shutterstock.
Consejo:
Puedes agregar una superposición de color o de degradado en la parte superior de la imagen. Haz clic en el cuadro de color para seleccionar un color o un degradado, luego arrastra el control deslizante para ajustar la opacidad de esta capa.
Para agregar un fondo de imagen a una sección de la página:
- Selecciona la sección correspondiente.
- Haz clic en el icono Abrir Inspector profesional en la parte superior derecha del Editor.
- Haz clic en + Agregar imagen o video en Multimedia.
- (En el Administrador de multimedia) Elige qué hacer a continuación:
- Selecciona o sube tu propia imagen.
- Hacer clic en la pestaña Multimedia de Wix/Unsplash para usar una de nuestras imágenes gratuitas.
- Haz clic en la pestaña Shutterstock para comprar una imagen en Shutterstock.
- Haz clic en Cambiar fondo.
- (Opcional) Personaliza el fondo de la imagen en el panel Inspector profesional:
- Punto focal: haz clic en el icono Punto focal
para seleccionar la parte de la imagen que siempre debe ser visible, incluso cuando el tamaño de la pantalla varía. - Opacidad: arrastra el control deslizante para cambiar la visibilidad de la imagen.
- Opciones de ajuste: haz clic en el menú desplegable para elegir cómo debe ajustarse la imagen a la sección.
- Punto focal: haz clic en el icono Punto focal
Agregar un video al fondo de la sección
Agrega un fondo de video para dar una sensación de movimiento a tu sección. Puedes elegir el punto de foco del video, cambiar la velocidad de reproducción y decidir si se reproduce en modo de repetición en bucle.
Tenemos una amplia biblioteca de videos gratuitos que puedes utilizar como fondo, pero también puedes usar tus propios archivos o comprar un video en Shutterstock.
Consejo:
Puedes agregar una superposición de color o de degradado en la parte superior del fondo del video. Haz clic en el cuadro de color para seleccionar un color o un degradado, luego arrastra el control deslizante para ajustar la opacidad de esta capa.
Para agregar un fondo de video a una sección de la página:
- Selecciona la sección correspondiente.
- Haz clic en el icono Abrir Inspector profesional en la parte superior derecha del Editor.
- Haz clic en + Agregar imagen o video debajo de Multimedia.
- (En el Administrador de multimedia) Elige qué hacer a continuación:
- Selecciona o sube tu propio video.
- Hacer clic en la pestaña Multimedia de Wix/Unsplash para usar uno de nuestros videos gratuitos.
- Haz clic en la pestaña Shutterstock para comprar un video de Shutterstock.
- Haz clic en Cambiar fondo.
- (Opcional) Personaliza el fondo del video en el panel Inspector profesional:
- Punto focal: haz clic en el icono Punto focal para seleccionar el área del video que siempre debe estar visible, incluso cuando se cambia el tamaño de la pantalla.
- Opacidad: arrastra el control deslizante para cambiar la visibilidad del video.
- Velocidad de reproducción: haz clic en el menú desplegable para seleccionar la velocidad (por ejemplo, Normal, 0,25x, 1,25x).
- Repetición en bucle: haz clic en la palanca para cambiar la forma en que se reproduce el video:
- Activada: el video se reproduce en un bucle infinito en segundo plano.
- Desactivada: el video solo se reproduce una vez para los visitantes y luego se detiene.
- Punto focal: haz clic en el icono Punto focal
¿Quieres verlo online?
Haz clic en el botón Reproducir en el video para saber cómo se ve directamente en el lienzo.
Agregar una superposición de texturas al fondo de la sección
Aplica una textura interesante sobre el fondo de la sección. Tenemos diversas texturas para elegir, en diferentes colores y tamaños. Navega por la lista y haz clic en las texturas que te gusten para ver cómo se mezclan con el fondo.
Para agregar una superposición de texturas al fondo de la sección:
- Selecciona la sección correspondiente.
- Haz clic en el icono Abrir Inspector profesional en la parte superior derecha del Editor.
- Activa la palanca Aplicar superposición de texturas en Superposición de fondo.
- Explora las texturas disponibles. Haz clic en una textura para agregarla como superposición y ver cómo se ajusta al fondo.
¿Te ha sido útil?
|