Editor X: cambiar el fondo de una sección

12 min de lectura
Editor X te permite diseñar todas y cada una de las secciones según tus necesidades exactas. Puedes elegir un color, un degradado, una imagen o un video para el fondo de tu sección. Agrega una superposición de patrones interesante y ajusta la opacidad para que el fondo no distraiga la atención del contenido. 
Puedes encontrar todas las opciones de fondo en la pestaña Diseño en el panel Inspector profesional. Las opciones que veas dependerán de la palanca Multimedia y patrón
En este artículo, aprende cómo diseñar el fondo de tu sección:
Consejo:
Para acelerar el proceso de diseño, hemos creado toneladas de secciones listas para usar y totalmente adaptativas en Secciones, en el panel Agregar. 

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 de fondo de una sección de la página:

  1. Haz clic en la sección de la página correspondiente en tu sitio.
  2. Haz clic en el icono Inspector profesional  en la parte superior del Editor X.
  3. Haz clic en el icono Diseño .
  4. Haz clic en el cuadro de color debajo de Color y opacidad.
  5. Dependiendo de tus preferencias, selecciona un color:
    • Colores del tema: selecciona uno de los colores de tu sitio.
    • Mis colores: elige un color existente personalizado.
    • Agregar color: haz clic en + Agregar para agregar un nuevo color al selector de color. 
  6. (Opcional) Arrastra el control deslizante para aumentar o disminuir la opacidad del fondo.

Agregar un gradiente al fondo de la sección

El Editor X ofrece diferentes tipos de gradientes para el fondo de tu sección:
  • Gradiente radial, lineal o cónico : Elige hasta 8 colores y controla la opacidad de cada color individualmente en estos gradientes. También puedes ajustar el ángulo (lineal), el punto focal (radial) o ambos (cónico) para lograr el aspecto que deseas.
  • Gradiente fluido : Este gradiente 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 gradiente.

Para agregar un fondo degradado a una sección de la página:

  1. Haz clic en la sección de la página correspondiente en tu sitio.
  2. Haz clic en el icono Inspector profesional  en la parte superior del Editor X.
  3. Haz clic en el icono Diseño .
  4. (Si está deshabilitada) Habilita la palanca de Multimedia y patrón.
  5. Haz clic en el cuadro de color debajo de Color.
  6. Dependiendo de tus preferencias, haz clic a continuación para aprender a crear cada tipo de gradiente:

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. 

Para agregar un fondo de imagen a una sección de página:

  1. Haz clic en la sección de la página correspondiente en tu sitio.
  2. Haz clic en el icono Inspector profesional  en la parte superior del Editor X.
  3. Haz clic en el icono Diseño .
  4. (Si está deshabilitada) Habilita la palanca Multimedia y patrón.
  5. Selecciona + Agregar una imagen o video para acceder al Administrador de multimedia, donde puedes:
    • Elegir una imagen de los archivos de tu propio sitio.
    • Seleccionar la pestaña Multimedia de Wix/Unsplash para usar una de nuestras imágenes gratuitas.
    • Seleccionar la pestaña Shutterstock para buscar una imagen en Shutterstock. 
  6. (Opcional) Personaliza el fondo de tu imagen:
    • Haz clic en el icono Punto de foco  para seleccionar la parte de la imagen que siempre debe estar visible, incluso cuando se cambia el tamaño de la pantalla.
    • Arrastra el control deslizante debajo de Opacidad para cambiar la visibilidad de la imagen.
    • Haz clic en el menú desplegable en Opciones de ajuste para elegir cómo debe ajustarse esta imagen a la sección.
Consejo:
Puedes agregar una superposición de color para hacer que el fondo de la imagen sea un poco más tenue. Selecciona Color para elegir uno, luego arrastra el control deslizante para ajustar la opacidad de esta capa. 

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.
Tenemos una biblioteca completa de videos gratuitos que puedes utilizar como fondo, pero también puedes usar tus propios archivos o comprar un video en Shutterstock.

Para agregar un fondo de video a una sección de página:

  1. Haz clic en la sección de la página correspondiente en tu sitio.
  2. Haz clic en el icono Inspector profesional  en la parte superior del Editor X.
  3. Haz clic en el icono Diseño .
  4. (Si está deshabilitada) Habilita la palanca Multimedia y patrón.
  5. Selecciona + Agregar una imagen o video para acceder al Administrador de multimedia, donde puedes:
    • Elegir un video de los archivos de tu propio sitio.
    • Seleccionar la pestaña Multimedia de Wix/Unsplash para usar uno de nuestros videos gratuitos.
    • Seleccionar la pestaña Shutterstock para buscar un video en Shutterstock. 
  6. (Opcional) Personaliza el fondo del video:
    • Haz clic en el icono Punto de foco para elegir el área del video que siempre debe estar visible, incluso cuando se cambia el tamaño de la pantalla.
    • Arrastra el control deslizante debajo de Opacidad para cambiar la visibilidad del video.
    • Haz clic en el menú desplegable en Velocidad de reproducción
    • Desliza la palanca Repetición continua para cambiar la forma de reproducción del video:
      • Habilitada: el video se reproduce en un bucle infinito en segundo plano. 
      • Deshabilitada: el video solo se reproduce una vez para los visitantes y luego se detiene. 
Consejo:
Puedes agregar una superposición de color para hacer que el fondo del video sea un poco más tenue. Selecciona Color para elegir uno, luego arrastra el control deslizante para ajustar la opacidad de esta capa. 

Agregar un patrón de superposición al fondo de la sección

Aplica un patrón interesante sobre el fondo de la sección. Tenemos diversos patrones para elegir, en diferentes colores y tamaños. Navega por la lista y selecciona los patrones que te gusten para ver cómo se mezclan con el fondo.
Antes de comenzar:
Asegúrate de que la palanca Multimedia y patrón esté habilitada para que puedas ver esta opción. 

Para agregar un patrón de superposición al fondo de la sección:

  1. Haz clic en la sección de la página correspondiente en tu sitio.
  2. Haz clic en el icono Inspector profesional  en la parte superior del Editor X.
  3. Haz clic en el icono Diseño .
  4. Desplázate hacia abajo hasta Superposición de fondo y habilita la palanca Patrón de superposición.
  5. Explora los patrones disponibles. Selecciona un patrón para agregarlo como superposición y ver cómo se ajusta al fondo. 

¿Te ha sido útil?

|