Cómo crear una ventana emergente en Brizy

PopUp Builder es una de las características ofrecidas por la versión Pro de Brizy. Puede usarlo para crear ventanas emergentes en su sitio web de WordPress de manera visual, sin codificar. Dependiendo de su propósito y necesidades, puede usar el generador emergente Brizy para crear cualquier tipo de ventana emergente. Desde una ventana emergente de marketing para recolectar clientes potenciales o simplemente un anuncio. Debido a su soporte de activación de clics, incluso puede usar el generador emergente para crear un menú de pantalla completa o un menú fuera de canvas en su sitio web de Brizy WordPress.
Básicamente, crear una ventana emergente utilizando la función Brizy PopUp Builder no es diferente de crear una página o plantilla con Brizy. Puede agregar cualquier elemento que desee sin excepción. Por ejemplo, puede agregar un elemento de formulario y conectarlo al HubSpot para recopilar clientes potenciales. O puede mostrar un producto presentado en su tienda WooCommerce. De todos modos. Cómo crear una ventana emergente en WordPress usando el generador emergente Brizy porque el generador emergente solo está disponible para la versión Pro Brizy, debe actualizar Brizy a la versión Pro si no lo ha hecho. Brizy ofrece tres planes, incluido un plan de vida si odia la opción basada en la suscripción.
Descargar Brizy Pro
El generador emergente de Brizy acepta los siguientes tipos de activación:
Al cargar la página
Hacer click
Después de la inactividad
La intención de salir de la página
Mostrar después de x
En el desfile
Llegando de
Además, el generador emergente de Brizy también acepta las condiciones de visualización. Significa que puede establecer la ventana emergente creada para aparecer en ciertas páginas en su sitio. Puede crear la ventana emergente desde cero o desde una plantilla predeterminada. Brizy ofrece más de 40 plantillas emergentes prefabricadas entre las que puede elegir. Para comenzar a crear una ventana emergente con Brizy, vaya a Brizy-> PopUps en el tablero de WordPress. Haga clic en el botón Agregar nuevo para crear una nueva ventana emergente. Dé un nombre a su ventana emergente y haga clic en el botón Publicar a la derecha, luego haga clic en el botón Editar con Brizy para editar la ventana emergente del editor de Brizy .

Se lo llevará al editor de Brizy después de hacer clic en el botón Editar con Brizy arriba. Haga clic en el botón Plus en el área de lona para comenzar a editar la ventana emergente. Como puede ver, hay docenas de plantillas emergentes desde las que puede elegir. Simplemente seleccione el que desea importarlo en el editor de Brizy. O puede hacer clic en Crear el suyo si desea crear la ventana emergente desde cero. En este ejemplo, crearemos la ventana emergente desde cero.

Antes de agregar cualquier contenido a la ventana emergente, primero puede configurar la alineación emergente, así como el tamaño de la ventana emergente (altura y ancho). Para hacer esto, puede hacer clic en el icono del mezclador en la esquina superior derecha para abrir la barra de configuración. Para establecer la alineación (vertical y horizontal), puede hacer clic en los iconos de alineación. Para establecer el tamaño, puede hacer clic en el icono de la rueda.

Una vez que haya establecido el tamaño y la alineación emergente, puede comenzar a agregar el contenido. Simplemente tire del elemento deseado del panel izquierdo al área de lienzo. Como mencioné, puede agregar contenido a la ventana emergente como al crear una página o plantilla con Brizy. ¿Nuevo en Brizy? Puede leer este artículo para averiguar cómo usar Brizy. Configurar el disparador y el estado de la pantalla Después de haber terminado y editado el contenido, puede establecer cómo y dónde aparecerá la ventana emergente estableciendo el tipo de activación y el gatillo y el estado de visualización. Para hacer esto, abra la barra de configuración haciendo clic en el icono del mezclador en la esquina superior derecha. Haga clic en el icono emergente (el más izquierdo), seguido de las condiciones de visualización.

Debajo de la pestaña desencadenantes, seleccione un tipo de activación que desea usar en el menú desplegable (puede agregar varios tipos de activación). Para establecer las condiciones de visualización, puede pasar a la pestaña Condición. Al igual que el disparador, puede agregar aún más condiciones de visualización. Haga clic en el botón Guardar para aplicar los cambios.

Personalización emergente Para hacer que la ventana emergente sea más convincente, puede personalizarla. Puede establecer cosas como el color de superposición, el fondo emergente, la animación de entrada, el botón de cierre, etc. Aquí hay algunas personalizaciones que quizás desee hacer. Configuración de fondo emergente Para configurar el fondo emergente, coloque el mouse sobre la ventana emergente y haga clic en el icono de flecha gris en la esquina superior izquierda. Si desea usar una imagen como fondo, puede hacer clic en la pestaña de fondo. Si desea usar un color sólido como fondo, puede hacer clic en la pestaña Color. Desde la pestaña Color, también puede establecer el color del borde, así como el tamaño del borde y la sombra de la caja. Configurando el color de superposición si crea la ventana emergente desde cero, su ventana emergente Tener una superposición púrpura con un cierto nivel de opacidad. Para cambiarlo, haga clic en el icono del mezclador para abrir la barra de configuración. Haga clic en la pestaña Color para abrir el selector de color. Simplemente seleccione un color que le guste y establezca el nivel de opacidad en consecuencia.


Establecer la animación de entrada también puede aplicar una animación de entrada en su ventana emergente para que no parezca inaudita. Para hacer esto, cruce el mouse sobre la ventana emergente y haga clic en el pequeño icono gris en la esquina superior izquierda del área emergente. Haga clic en el icono de la rueda seguido del enlace Más configuración para abrir el panel de configuración.

Puede establecer la animación de entrada en la opción de animación de entrada en la pestaña avanzada del panel de configuración. También hay opciones para establecer la duración de la animación, así como el retraso en la opción de animación de entrada. Personalización del botón de cierre de forma predeterminada, la ventana emergente tiene un botón de cierre blanco. Para personalizarlo, puede hacer clic en el botón de cierre para abrir la barra de configuración. Para deshabilitar/activar el botón de cierre, puede hacer clic en el tercer icono (izquierda) en la barra de configuración. Para establecer la posición, puede hacer clic en el último icono. Para establecer el tamaño, puede hacer clic en el icono de la estrella. Para establecer el color, puede hacer clic en la pestaña Color para abrir el selector de color.

El resultado final Brizy (versión Pro) viene con una función de generación emergente, lo que le permite crear ventanas emergentes en su sitio de WordPress sin instalar un complemento adicional. Al crear una ventana emergente con Brizy, puede agregar cualquier elemento como al crear una página. El generador emergente de Brizy acepta una amplia gama de tipos de activación, así como condiciones de visualización para permitirle controlar el comportamiento emergente. Una cosa menor. La ventana emergente creada con Brizy solo aparecerá en páginas y plantillas con sede en Brizy. La ventana emergente no aparecerá en las páginas o publicaciones que ha creado con el editor de bloques de WordPress (Gutenberg) a menos que cree una plantilla personalizada para la publicación y la página con Brizy.