Modificar un popup existente

Esta guía explica cómo acceder y modificar la configuración de un popup ya creado, incluidas las opciones de contenido, visualización y apariencia.


1. Acceder al Popup a Modificar

1. Accede a la sección de gestión de los Popups.

2. En la tabla principal, localiza el popup que deseas modificar. Puedes usar las columnas ID, Título o Fecha de Creación para orientarte.

3. Haz clic en el título del popup o en el icono de edición (si está presente) para abrir la pantalla de edición.

La pantalla de edición está dividida en cuatro secciones principales (pestañas): Contenido, Condiciones, Comportamiento y Apariencia.

2. Modificar el Contenido

Esta sección te permite definir el título y el contenido visible del popup.

1. En la pestaña Contenido:

  • Modifica el Título del popup.
  • Marca o desmarca la casilla Mostrar automáticamente.
  • Nota: Si la casilla está desmarcada, el popup no aparecerá automáticamente. Para invocarlo deberás usar el código JavaScript proporcionado bajo la etiqueta: Invoca la apertura del popup mediante los eventos del Visual Builder o utiliza el siguiente código JavaScript.
  • Modifica el Contenido del popup utilizando el editor visual.

3. Configurar las Condiciones de Visualización

Esta sección define a quién y dónde debe mostrarse el popup. Esta pestaña es visible solo si está activa la opción Mostrar automáticamente.

1. Cambia a la pestaña Condiciones.

2. En el cuadro principal:

  • Selecciona la casilla Mostrar a todos si no deseas aplicar condiciones específicas.
  • Si Mostrar a todos no está seleccionado, utiliza la sección Gestionar condiciones para definir reglas específicas (por ejemplo, basadas en el comportamiento del usuario).

3. En el cuadro Login:

  • Define el Estado de acceso mediante el menú desplegable:
  • Mostrar a todos
  • Solo usuarios registrados
  • Solo usuarios no registrados

4. En el cuadro Limitar mediante enlace:

  • En el campo Mostrar SOLO en las siguientes páginas, introduce los enlaces de las páginas donde debe estar activo el popup.
  • En el campo NO mostrar en las siguientes páginas, introduce los enlaces de las páginas donde debe estar oculto el popup.
  • Selecciona la casilla Aplicar también a posibles páginas hijas para extender las reglas de inclusión/exclusión.

4. Definir el Comportamiento

Esta sección controla cuándo y cómo aparece y desaparece el popup. Esta pestaña es visible solo si está activa la opción Mostrar automáticamente.

1. Cambia a la pestaña Comportamiento.

2. Configura el Trigger apertura (cuándo debe abrirse el popup):

  • Selecciona una opción entre: Al abrir la página, Antes de cerrar la página o Al hacer scroll en la página.

3. Configura el Trigger cierre (cómo puede cerrarse el popup):

  • Elige entre las opciones disponibles, por ejemplo: Click en botón de cierre y click externo, o No permitir cierre.

4. Marca la casilla Mostrar insistentemente si quieres que el popup aparezca en cada visita.

  • Si no marcas Mostrar insistentemente, define el intervalo en Mostrar cada (en días).

5. En el cuadro Preferencias, las opciones cambian según el Trigger apertura elegido en el punto 2:

  • Si elegiste "Al abrir la página": Configura la Espera (en segundos) y/o oculta automáticamente después de (en segundos).
  • Si elegiste "Antes de cerrar la página": Configura la Permanencia mínima (en segundos) y/o oculta automáticamente después de (en segundos).
  • Si elegiste "Al hacer scroll en la página": Configura el mínimo porcentaje de scroll (Scroll página mínimo) (%).

5. Personalizar la Apariencia

Esta sección gestiona la apariencia visual del popup.

1. Cambia a la pestaña Apariencia.

2. Define la Tipología: Popup simple o un tipo Offcanvas (Izquierda o Derecha).

  • Nota: Si eliges un tipo Offcanvas, las opciones de Animación se ocultarán.

3. Establece el Ancho máximo (en px).

4. Elige el color de fondo del popup y del botón de cierre utilizando los selectores de color.

5. En el cuadro Overlay:

  • Selecciona el tipo de Overlay (el fondo que cubre la página detrás del popup): Oscuro, Claro, Personalizado o Ninguno.
  • Si eliges Personalizado, configura el color y la opacidad (en %).

6. En el cuadro Animaciones (no visible para Offcanvas):

  • Elige la animación de entrada y salida desde los menús desplegables.

7. Para visualizar los cambios antes de guardar, haz clic en el botón Ver vista previa.

6. Guardar los Cambios

Después de completar todas las modificaciones:

1. Haz clic en el botón guardar (usualmente Guardar o Finalizar, dentro del contexto de un formulario con pestañas/ asistente) para aplicar los cambios al popup.