Centro de Ayuda Wix
    Inicio
  1. Crear tu sitio
  2. Usar el Editor de Wix
  3. Agregar y personalizar elementos
  4. Cajas y contenedores
    5. Editor de Wix: personalizar una ventana interactiva

Editor de Wix: personalizar una ventana interactiva

9 min de lectura
Personaliza cualquier ventana interactiva para que se vea exactamente como quieres. Puedes elegir una superposición para cubrir la página alrededor de la ventana interactiva, establecer la posición de esta y cambiar el fondo para crear un diseño único para tu marca. 
En este artículo, obtén más información sobre lo siguiente:
Captura de pantalla de una ventana interactiva personalizada en un sitio Wix en vivo.

Ajustar el estilo de la ventana interactiva

Establece dónde aparece la ventana interactiva en tu página. Puedes elegir una esquina de la página donde debe aparecer y ajustar la distancia de la ventana interactiva desde los bordes de la pantalla (delimitación).

Para elegir el estilo de la ventana interactiva:

  1. Ve al editor.
  2. Haz clic en Páginas y menú  a la izquierda del editor.
  3. Haz clic en Ventanas.
  4. Haz clic en la ventana interactiva correspondiente para abrirla.
  5. Selecciona la ventana interactiva en el editor.
  6. Haz clic en el icono Estilo .
  7. Elige cómo quieres ajustar el estilo:
    • Posición: haz clic en un rectángulo de la cuadrícula para establecer la posición de la ventana interactiva en la página.
    • Distancia horizontal: mueve el cuadro a la izquierda o a la derecha de la pantalla.
    • Distancia vertical: mueve el cuadro hacia arriba o hacia abajo en la pantalla.
El panel de estilo de la ventana interactiva. El cursor pasa sobre la opción de colocar la ventana interactiva en el centro.

Configurar la superposición de la ventana interactiva

La superposición es el espacio alrededor de la ventana interactiva que bloquea el resto del sitio. Esto ayuda a los visitantes a centrarse en el mensaje de la ventana interactiva. Elige si los visitantes de tu sitio pueden hacer clic en la superposición para cerrar la ventana interactiva.

Para configurar la superposición:

  1. Ve al editor.
  2. Haz clic en Páginas y menú  a la izquierda del editor.
  3. Haz clic en Ventanas.
  4. Haz clic en la ventana interactiva correspondiente para abrirla.
  5. Haz clic en cualquier lugar fuera de la ventana interactiva para seleccionar esta área.
  6. Elige qué hacer a continuación:
    • Decide si los visitantes hacen clic en la superposición para cerrar la ventana interactiva: 
      1. Haz clic en Transparencia.
      2. Activa o desactiva la palanca Se cierran con un clic.
        Nota: Si desactivas esta opción, asegúrate de tener un icono "X" o un botón "Cerrar" en la ventana interactiva. 
    • Diseña la superposición: 
      1. Haz clic en Cambiar fondo de superposición.
      2. Elige entre un color, una imagen o un video de fondo.
      3. (Opcional) Haz clic en Ajustes para ajustar la superposición.
        Consejo: Puedes ajustar la opacidad del color y los fondos de las imágenes. Recomendamos hacer la superposición ligeramente transparente para que los visitantes puedan seguir viendo la página detrás de la ventana interactiva, pero entiendan que está bloqueada.
Se hace clic fuera de la ventana interactiva para acceder a los ajustes de superposición en el Editor de Wix
Superposiciones en tu sitio optimizado para dispositivos móviles:
  • No es posible editar la superposición de la ventana interactiva en la versión móvil de tu sitio.
  • Si agregas una superposición de color o imagen en la versión de escritorio, esto se aplica automáticamente al sitio móvil. Sin embargo, si agregas una superposición de video, esta se convertirá en una imagen fija del video en la versión móvil del sitio.

Configurar el fondo de la ventana interactiva

Elige tener un fondo de color, de imagen o de video en la ventana interactiva. Según el tipo que elijas, también puedes ajustar la configuración, como la visibilidad y la escala.

Para elegir un fondo para la ventana interactiva:

  1. Ve al editor.
  2. Haz clic en Páginas y menú  a la izquierda del editor.
  3. Haz clic en Ventanas.
  4. Haz clic en la ventana interactiva correspondiente para abrirla.
  5. Selecciona la ventana interactiva en el editor.
  6. Haz clic en el icono Diseño .
  7. Haz clic en el tipo de fondo que deseas para tu ventana interactiva:
    • Color: selecciona un color en el selector de color o agrega y ajusta un degradado impresionante. 
    • Imagen: selecciona tu propia imagen, una de Wix o de Shutterstock.
    • Video: selecciona un video de Wix gratuito o sube el tuyo.
  8. (Opcional) Haz clic en Ajustes para ajustar el fondo a tu gusto.
El fondo de la ventana interactiva en el editor. El cursor pasa sobre la opción

Personalizar el botón Cerrar de la ventana interactiva

Ajusta el aspecto y el estilo del botón en el que los visitantes hacen clic para cerrar la ventana interactiva. Puedes elegir el texto, establecer la alineación del texto del botón y personalizar su diseño para la vista Normal y Efecto cursor de modo que se destaque.

Para personalizar el botón para cerrar:

  1. Ve al editor.
  2. Haz clic en Páginas y menú  a la izquierda del editor.
  3. Haz clic en Ventanas.
  4. Haz clic en la ventana interactiva correspondiente para abrirla.
  5. Selecciona la ventana interactiva en el editor.
  6. Haz clic en el botón Cerrar.
  7. Elige cómo personalizar el botón:
El panel de diseño del icono de cierre. El cursor pasa sobre la pestaña Texto, que está abierta.

Personalizar el icono X

Si has habilitado un icono X (cerrar ventana interactiva) en el panel Ajustes de la ventana interactiva, puedes ajustar su aspecto para que se adapte a tu estilo. Elige entre una variedad de diseños y personaliza el color, la visibilidad y el borde.

Para personalizar el icono X:

  1. Ve al editor.
  2. Haz clic en Páginas y menú  a la izquierda del editor.
  3. Abre la ventana interactiva correspondiente.
  4. Haz clic en la ventana interactiva desde el editor.
  5. Haz clic en el icono Cerrar ventana interactiva (X).
  6. Haz clic en el icono Diseño .
  7. Elige cómo quieres personalizar el icono X:
    • Seleccionar un nuevo diseño: haz clic en un preajuste del panel para establecer un nuevo diseño para el icono.
    • Personalizar el icono: haz clic en Personalizar y edita el icono como desees:
      • Rellenos de fondo: selecciona el color del icono en el selector de color y usa el control deslizante para hacerlo más o menos visible.
      • Bordes: elige un color para los bordes del icono y establece su ancho (en píxeles).
El panel de diseño del icono X. El cursor pasa sobre el control deslizante de ancho de los bordes.

¿Te ha sido útil?

|
En este artículo
  • Ajustar el estilo de la ventana interactiva
  • Configurar la superposición de la ventana interactiva
  • Configurar el fondo de la ventana interactiva
  • Personalizar el botón Cerrar de la ventana interactiva
  • Personalizar el icono X