WPBakery Page Builder Modal Popups

Crear ventanas emergentes con facilidad utilizando el elemento Modal Box del UAVC

En el mundo del diseño web, las ventanas emergentes son una herramienta invaluable para captar la atención de los visitantes y mostrarles información importante de manera destacada. Con el elemento Modal Box del UAVC, puedes crear fácilmente ventanas emergentes personalizadas y desencadenarlas con solo hacer clic en un elemento de menú de WordPress. En este artículo, te mostraremos cómo hacerlo paso a paso.

Paso 1: Crear una nueva sección y añadir un Modal Box

Lo primero que debes hacer es crear una nueva sección en tu página y añadir un elemento Modal Box dentro de ella. Este elemento te permitirá diseñar y personalizar tu ventana emergente según tus necesidades. Puedes elegir el tamaño, los colores, las animaciones y cualquier otro aspecto que desees para que se adapte perfectamente al estilo de tu sitio web.

Paso 2: Configurar la activación de la ventana emergente

Una vez que hayas diseñado tu ventana emergente, debes configurar cómo se activa. En la pestaña General del elemento Modal Box, encontrarás la opción “Display Modal On -> Selector”. Aquí es donde puedes agregar una clase CSS personalizada que se utilizará como selector para desencadenar la ventana emergente cuando se haga clic en un elemento de menú específico.

Paso 3: Añadir la clase CSS personalizada al menú de WordPress

Para asegurarte de que la ventana emergente se active correctamente, debes agregar la clase CSS personalizada al elemento de menú de WordPress que deseas utilizar como desencadenante. Para hacer esto, ve a tu Panel de WordPress -> Apariencia -> Menús. Asegúrate de habilitar la opción “CSS Classes” en la configuración de las “Screen Options”. Luego, selecciona el elemento de menú deseado y añade la clase CSS personalizada en el campo correspondiente.

Paso 4: Probar la ventana emergente

Una vez que hayas configurado todo correctamente, es hora de probar tu ventana emergente. Abre una página donde hayas utilizado el Modal Box y haz clic en el elemento de menú que has configurado para activar la ventana emergente. Si todo se ha configurado correctamente, la ventana emergente debería aparecer de inmediato. Puedes experimentar con diferentes páginas y elementos de menú para asegurarte de que la ventana emergente se active correctamente en cada caso.

Activar la ventana emergente en todo el sitio web

Si deseas que la ventana emergente se active en todas las páginas de tu sitio web, puedes seguir algunos pasos adicionales. Dirígete a la configuración de depuración de Ultimate Addons y activa la opción “Modal On Menu”. Luego, pega el siguiente código en el archivo functions.php de tu tema o tema hijo:

function ultimate_VC_modal_popup() {
    echo do_shortcode( ' Close ' );
}
add_action('wp_footer', 'ultimate_VC_modal_popup');

Conclusión

Crear ventanas emergentes efectivas y atractivas ya no tiene por qué ser complicado. Con el elemento Modal Box del UAVC, puedes diseñar y activar ventanas emergentes personalizadas con solo unos pocos clics. Sigue los pasos mencionados anteriormente y aprovecha al máximo esta función para mejorar la experiencia de tus visitantes y lograr tus objetivos de conversión.