Cómo crear una ventana emergente en la división utilizando el Div Supremo

A diferencia de Elementor y Brizy (léase: Elementor vs Div, Div vs Brizy), Div no tiene una función incorporada para crear una ventana emergente. Si desea crear una ventana emergente en su sitio web de WordPress alimentado por DIV, puede instalar un complemento. Un complemento de división que recomendamos es el Supremo Div. Es uno de los complementos de división más populares, disponibles en Div Marketplace. El complemento en realidad se lanza como un complemento Freemium, pero el generador emergente solo está disponible en la versión Pro, por lo que debe usar la versión Supreme Diva Supreme para crear una ventana emergente.
El creador emergente de la diva suprema acepta cuatro tipos de ventanas emergentes: apariencia, iframe, video e imagen. En este artículo, le mostraremos cómo crear una ventana emergente a partir de un aspecto. Este tipo de ventana emergente primero requiere que cree un aspecto emergente antes de que pueda llamarlo. La apariencia emergente se puede crear utilizando el editor visual de Divi Builder. Sobre el tipo de desencadenante, el Div Supremo
Hacer click
Al cargar la página
Con la intención de salir
Desfile en la página
Cómo crear una ventana emergente en Divre usando el Supreme Divine antes de continuar, asegúrese de haber instalado Supreme Divin (versión Pro) en su sitio de WordPress.
Como se mencionó anteriormente, crearemos la ventana emergente a partir de un aspecto de este ejemplo. Crearemos una ventana emergente simple de la siguiente manera:

Solo se necesitan dos pasos para crear una ventana emergente utilizando el Supreme Div. Paso 1: Cree la plantilla de apariencia/emergente en el primer paso, debe crear la apariencia de la ventana emergente. Luego puede llamar al look desde una página donde desea que aparezca la ventana emergente. Para crear un aspecto pop -Up, vaya a la biblioteca Div -> Divi en el tablero de WordPress y haga clic en el botón Agregar nuevo para crear un nuevo aspecto. Da un nombre a tu look. En el campo Tipo de diseño, seleccione Diseño. Haga clic en el botón Enviar.

En el cuadro de diálogo que aparece, puede seleccionar la opción a la izquierda (edificio desde Zaza) y haga clic en el botón inicia.

Haga clic en el botón Build on the Frond End para crear el look usando el editor visual Divi Builder.

Una vez que se abre el editor de Divu Builder, puede preparar la apariencia agregando las secciones y filas necesarias. Una vez que el aspecto esté listo, puede agregar los módulos que desea agregar. Puede agregar cualquier módulo a la ventana emergente de acuerdo con sus necesidades en nuestro caso (como puede ver en el GIF anterior), solo agregamos el módulo de formulario de contacto.

Una vez que haya terminado de editar el aspecto emergente, puede hacer clic en el botón Guardar en la esquina inferior derecha para guardar los cambios, seguido de la salida de Visual Builder en Bara de Sus para salir del editor Divi Builder.
Haga clic en el botón Actualizar para actualizar el aspecto emergente.

Paso 2: Llame al aspecto emergente Una vez que el aspecto emergente esté listo, puede llamarlo para mostrarlo. Puede llamar al aspecto emergente en cualquier página de su sitio. Incluso puede llamar a la aparición emergente en una plantilla personalizada (por ejemplo, una plantilla de sótano personalizada) que creó con el constructor de temas. Como mencioné anteriormente, el generador emergente del Supremo Div: At Click, al cargar La página, la intención de salir y en la página. En este ejemplo, llamaremos a la ventana emergente usando el disparador para hacer clic. Primero, edite una página (o plantilla personalizada) que desee llamar al look emergente usando Divi Builder. Una vez que se abra el editor Divi Builder, seleccione un módulo. Haga clic en el icono de la rueda para abrir el panel de configuración.

En el panel de configuración, abra el bloque de visibilidad en la pestaña avanzada. Active la opción de uso emergente. En la opción Tipo emergente, seleccione el aspecto. En la opción emergente (DIV), seleccione el aspecto emergente que acaba de crear en el paso uno anterior.
Puede desplazarse hacia abajo para ver más opciones. Por ejemplo, en la opción de activación de activación, puede seleccionar el tipo de activación para llamar al aspecto emergente. Y en la opción de cierre, los desencadenantes pop -UP, puede seleccionar cómo se cerrará la ventana pop -UP.

Aquí hay algunas opciones de configuración que puede seleccionar:

Desencadenar

Método (disparador) para llamar a la apariencia emergente. Como se mencionó, hay cuatro tipos de desencadenantes ofrecidos por Supreme Div:
En el clic: este tipo de disparador requiere que el visitante haga clic en un elemento en particular para que el aspecto emergente se cargue. Hay cuatro tipos de elementos que puede usar: módulo, botón, imagen y enlace. Carga de página: este tipo de disparador llamará al aspecto emergente en función de la carga de la página. La ventana emergente aparecerá una vez que la página esté completamente cargada, con un cierto retraso dependiendo de la duración que se ha establecido anteriormente.
Desfile de la página: este tipo de disparador llamará a la apariencia emergente en función de la página. La ventana emergente aparecerá cuando un usuario esté ejecutando la página.
Intención de salida: este tipo de disparador llamará a la ventana emergente a la intención de salida. La ventana emergente aparecerá cuando un visitante tenga la intención de salir de la página haciendo clic en el botón de cierre.
Cierre los disparadores emergentes
Desde esta opción de configuración, puede seleccionar cómo está cerrada la ventana emergente. Si elige la opción emergente externa, la ventana emergente se cerrará cuando un visitante haga clic en cualquier área fuera de la ventana emergente. Si elige la opción del botón de cierre, la ventana emergente se cerrará cuando un visitante haga clic en el botón de cierre.
Use el cierre emergente automático
Puede seleccionar esta opción de configuración si desea que la ventana emergente se cierre automáticamente. Puede establecer el tiempo de cierre automático después de activar esta opción.
Retraso programado
Por defecto, el supremo Divin muestra emergente por segundo después de que se cumple la condición del activador. Puede establecer el retraso personalizado de esta opción.
Vencimiento de la galleta
Por defecto, la ventana emergente solo aparecerá una vez cada 30 días a un usuario. Puede establecer la fecha de vencimiento personalizada de la ventana emergente desde esta configuración. Por ejemplo, si establece el número en 7, la ventana emergente aparecerá una vez cada 7 días a un usuario. Entrada a
Puede establecer la animación de entrada de la ventana emergente desde esta opción de configuración.
Salir de la animación
Puede establecer la animación de salida de la ventana emergente desde esta opción de configuración.
Posición emergente
Esta opción de configuración le permite establecer la posición de la ventana emergente.
Tipo de posición emergente
Esta opción de configuración le permite establecer el tipo de posición de ventana emergente. Fijo o absoluto.
Usar ancho completo
Puede activar esta opción si desea que se muestre la ventana emergente en modo de ancho completo.
Ancho emergente máximo
Puede establecer el ancho máximo de la ventana emergente desde esta opción de configuración.
Mostrar superposición
Si desea mostrar superposición, simplemente puede activar esta opción. Luego puede configurar el color de superposición en el selector de color debajo de él.
Muestra el botón de cierre
Si desea mostrar el botón de cierre, puede activar esta opción.Si se activa esta opción, puede establecer el tamaño del icono, el color del icono y colocar el icono (dentro o fuera de la ventana emergente).Después de haber terminado de editar la página, puede publicarla para aplicar los cambios, incluida la ventana emergente.Cómo mostrar la ventana emergente en todo el creador emergente del sitio web del Supreme Divin no acepta las condiciones de visualización, pero no significa que tenga que editar cada página en su sitio para mostrar la apariencia emergente.En su lugar, puede usar la función de constructor de temas de Divin para mostrar la ventana emergente en todo el sitio web.Por ejemplo, puede activar la ventana emergente en uno de los elementos del encabezado o sótano global.En el tablero de WordPress, vaya a Div -> Temor Builder.Agregue un sótano global, un cuerpo global o un encabezado.