Agregar ventanas

Una ventana se complementa con el diseño de la aplicación. Para agregar ventanas a una experiencia web, vaya al panel Página, haga clic en la pestaña Ventana, haga clic en el botón Agregar ventana y seleccione una plantilla. A diferencia de una página, una ventana solo tiene contenido de cuerpo. Cuando agrega widgets a una ventana, estos se enumeran en la sección Contorno de la pestaña Ventana y el menú de navegación rápida (en la parte inferior de la ventana del builder). Las ventanas se agrupan por ventanas fijas y ancladas. Puede apuntar a una ventana en el panel y hacer clic en Establecer como presentación si la ventana aún no está conectada para abrirla en una página. Para cambiar el nombre o eliminar una ventana, haga clic en el botón de más opciones de la ventana y elija Cambiar nombre o Eliminar. Al agregar una ventana nueva, su etiqueta sigue una regla de numeración consecutiva. Por ejemplo, al duplicar Ventana 1 se genera Ventana 2, o Ventana 3 si ya existe Ventana 2. Para ventanas fijas (excepto presentación), el nombre de la ventana también se utiliza en la dirección URL de la experiencia. (Si cambia el nombre de una ventana después de publicar, las direcciones URL utilizadas anteriormente seguirán funcionando).

Utilice las siguientes opciones para administrar las ventanas de su aplicación:

  • Las ventanas de presentación que se abren con la experiencia web se pueden establecer en el panel Ventana. Apunte a una ventana de Ventanas fijas (excepto a aquellas que estén conectadas para abrirlas en una página) y haga clic en el botón Establecer como presentación. Una experiencia web puede tener una ventana de presentación.
  • Para que una ventana se abra con una página, vaya a la configuración de Página y elija una ventana fija en el menú Abrir con ventana. Las ventanas establecidas como presentación no aparecerán en las opciones. Una vez que se establece que se abra una ventana con una página, aparece el icono Abrir con página junto a ella en el panel Ventana. Apunte al icono de información sobre herramientas con el nombre de la página conectada. Las ventanas de página solo aparecen una vez en la experiencia web a menos que el usuario actualice el navegador.
  • Configure Definir vínculo para abrir una ventana con un ajuste de widget. En una ventana de widget Definir vínculo, en Vínculo, elija Ventana y seleccione una ventana anclada o fija (excepto presentación). Las ventanas desencadenadas por widgets aparecen cada vez que un usuario hace clic en el widget.

Configuración

Las ventanas incluyen los siguientes ajustes de configuración:

  • Modo
    • Fija: aparece en una posición fija
    • Anclada: aparece junto al widget vinculado
    Nota:

    Puede cambiar un modo de ventana en su configuración; sin embargo, debido a los diferentes mecanismos de activación para ventanas fijas que se establecen como presentación o se conectan para abrirse con una página, no puede cambiarlos al modo Anclada (y viceversa).

  • Posición y tamaño
    • Posición: las ventanas fijas tienen cinco posiciones para mostrar: centro, izquierda, superior, derecha e inferior. (Aparecen ventanas ancladas junto al widget asociado y la posición se establece automáticamente).
    • Tamaño: puede especificar valores para el ancho y la altura de una ventana anclada o una ventana fija si está posicionada en el centro. Puede hacer clic en el botón Relación de aspecto para mantener la relación de aspecto entre el ancho y la altura. No obstante, si se trata de una ventana fija situada en la posición superior/inferior, solo puede especificar valores para la altura (el ancho se establece automáticamente en función del ancho de página). Del mismo modo, si se trata de una ventana fija situada a la izquierda o la derecha, solo puede especificar valores de ancho. También puede arrastrar el eje en el lienzo para ajustar el tamaño de la ventana.
    Nota:

    Cuando la ventana utiliza un diseño personalizado para dispositivos de pantalla mediana o pequeña, puede personalizar la posición, el tamaño y el diseño de la ventana. Los iconos de la configuración de posición y tamaño indican a qué tamaño de pantalla (grande, mediano y pequeño) se aplica la configuración.

  • Opciones de cierre
    • Hacer clic fuera para cerrar la ventana: proporcione una forma de cerrar una ventana haciendo clic en cualquier parte fuera de ella.
    • Interacción (modo fijo solamente)
      • Estilo: elija un diseño para la casilla de verificación y el botón.
      • Tipo: elija el tipo de interacción de la ventana.
        • Confirmación: requiere que los usuarios finales activen la casilla de verificación para cerrar la ventana. Esta restricción se aplica a todos los métodos de cierre. Esta interacción muestra la ventana una vez de manera predeterminada, a menos que active Mostrar siempre esta ventana.
        • Opción "No volver a mostrar": el usuario final activa este cuadro de la ventana para impedir que se vuelva a abrir. También puede cerrar la ventana con este cuadro activado o sin activar.
          Sugerencia:

          Para que vuelva a aparecer la ventana después de activar el cuadro, guarde la experiencia otra vez y abra su vista previa o vuelva a publicar la experiencia y visualice el elemento publicado.

      • Texto de la casilla de verificación: proporcione el texto que aparecerá junto a la casilla de verificación y cambie el tamaño de la fuente (en píxeles o rem).
      • Texto del botón: proporcione el texto que aparecerá en el botón (si corresponde) y cambie el tamaño de la fuente (en píxeles o rem).
    • También puede agregar un widget de botón en la ventana para cerrarlo. Utilice Definir vínculo en la configuración del botón y puede vincular el botón a una página para cerrarlo. Si necesita establecer varias páginas para abrirlas con una única ventana o botones en diferentes páginas vinculados a una única ventana, la vinculación con una página específica no resulta muy práctica para estas condiciones, por lo que puede establecer el vínculo a la página actual para volver a la página que activa la ventana.
      Nota:

      Aunque se puede establecer el vínculo de los botones de una ventana con otra ventana de la aplicación, no se recomienda.

  • Animación: agregue animación para la ventana y para su widget contenido.
  • Color de máscara: elija un color para la máscara que rellena el espacio alrededor de la ventana. Solo las ventanas fijas tienen esta opción.
  • Fondo: establezca el fondo de la ventana eligiendo un color de relleno o una imagen.
  • Borde: defina el borde de la ventana eligiendo su color, estilo y ancho. Puede cambiar el tamaño del radio para dar forma a las esquinas de la ventana.
  • Sombra del cuadro: agregue un efecto de sombra alrededor de la ventana.

Plantillas

Las ventanas configurables tienen las siguientes plantillas predefinidas:

  • Confirmar es un preajuste de plantilla con una confirmación de cierre y está diseñado para el contenido que necesita verificación o revisión para continuar.
  • Alerta es una plantilla que permite a los usuarios aceptar o rechazar un mensaje.
  • Las plantillas Simple y Vogue son dos diseños diferentes concebidos para mostrar o introducir información.
  • Nueva proporciona un diseño con un botón de cierre fuera del contenido principal.
  • Barra lateral es una plantilla situada a la derecha de forma predeterminada y está diseñada para mostrar texto largo para desplazarse verticalmente.
  • Información sobre herramientas es una plantilla para ventanas ancladas que proporciona más información sobre el widget vinculado, como un botón o una imagen.
  • Carrusel es una plantilla para una ventana más grande para mostrar varias imágenes y contenido en una vista cíclica.
  • Particulares es una plantilla para una ventana más grande que proporciona más información mediante un gráfico, una tabla, una lista, imágenes, botones y opciones de uso compartido en redes sociales.
  • Pasos es una plantilla diseñada para mostrar o presentar información en varias vistas.