Cómo crear una ventana emergente de Lightbox en su sitio (paso a paso)
Publicado: 2021-12-31¿Está buscando una manera de crear una ventana emergente de lightbox para su sitio?
Una ventana emergente de lightbox puede ser increíblemente efectiva para capturar clientes potenciales. Están diseñados para convencer y convertir.
Pero tener que codificar uno desde cero es un verdadero fastidio. Por un lado, tendría que saber suficiente HTML, CSS y Javascript para crear la ventana emergente junto con las reglas de activación para cuándo mostrarla. Luego, tendría que crear una integración manual con su proveedor de servicios de correo electrónico. Y finalmente, tendría que lidiar con cualquier problema de privacidad y seguridad.
Buenas noticias: hay una forma mucho más sencilla.
En este artículo, le mostraremos cómo iniciar una ventana emergente de lightbox sin codificación en menos de 10 minutos.
Sumerjámonos.
¿Qué es una ventana emergente de Lightbox?
Una ventana emergente de lightbox es un formulario de suscripción que aparece con un efecto cinematográfico. Cuando aparece una caja de luz, desenfoca el resto del sitio en el fondo. De esta manera, todo su enfoque está en la ventana emergente.

Originalmente, el concepto de cajas de luz proviene de la publicidad exterior:

Y luego, algunos desarrolladores pensaron que este era un efecto realmente genial y crearon una biblioteca Javascript para recrear el mismo efecto en los activos web. Más tarde, surgió la idea de usar ventanas emergentes de lightbox.
Por qué funcionan las ventanas emergentes de Lightbox
Las ventanas emergentes de Lightbox capturan más correos electrónicos que un formulario de suscripción de correo electrónico tradicional.
Pero ¿por qué funcionan?
Echemos un vistazo rápido a las razones principales por las que las ventanas emergentes de lightbox funcionan tan bien.
#1. Las ventanas emergentes de Lightbox presentan una clara llamada a la acción
La mayoría de la gente cree que es bueno dar a sus clientes muchas opciones.
Pero eso no es realmente cierto.
Si está buscando conversiones directas, quiere un llamado a la acción único y claro en el que su audiencia pueda enfocarse. De esta manera, elimina todas las distracciones de la mente del usuario. Y las ventanas emergentes de lightbox hacen un gran trabajo al resaltar su oferta principal y hacer que las personas se centren en su llamado a la acción.
Entonces, naturalmente, las tasas de conversión son bastante buenas.
#2. Las ventanas emergentes de Lightbox son imposibles de ignorar
Las ventanas emergentes de Lightbox ocupan toda la pantalla y desenfocan todo lo demás. Por lo tanto, es prácticamente imposible ignorarlos.
Esto es especialmente cierto si están animados:

Por supuesto, debe asegurarse de que sus ventanas emergentes no sean intrusivas. Y puede hacerlo personalizando cuándo activar diferentes ventanas emergentes en su sitio. Mientras su audiencia no se moleste por la interrupción, puede convencerlos y convertirlos muy fácilmente.
#3. Las ventanas emergentes de Lightbox tienen disparadores personalizados
No deberías mostrar la misma oferta a todos los visitantes de tu web. Si tiene una tienda de comercio electrónico, necesitará ofertas muy diferentes para clientes nuevos y recurrentes.
Para un nuevo cliente, puede activar una campaña de bienvenida:

Pero para un cliente que regresa, es posible que desee enviarle una oferta diferente:

Observe cómo los montos de descuento para ambas ofertas son exactamente iguales. Pero la forma en que se enmarca la oferta es drásticamente diferente. Y esto es muy importante porque las ventanas emergentes de lightbox están diseñadas para efectos teatrales. Por lo tanto, un enfoque más personalizado le dará mejores resultados con seguridad.
Incluso podría personalizar la oferta según las preferencias de contenido de su usuario. Si están leyendo un artículo sobre recetas para la cena, tiene más sentido mostrarles una oferta relacionada con recetas para la cena en lugar de mostrarles una oferta para automóviles.

#4. Las ventanas emergentes de Lightbox pueden capturar a los visitantes que abandonan
Las cajas de luz son solo un método para mostrar su ventana emergente. Por lo tanto, realmente no hay nada que le impida personalizar el gatillo en la medida que desee. Recomendamos crear ventanas emergentes de lightbox con intención de salida.

Las ventanas emergentes de intención de salida se activan cuando sus visitantes intentan salir de su sitio web. Como resultado, retiene una gran cantidad de visitantes que de otro modo habrían abandonado su sitio. Por lo tanto, si está sufriendo de abandono del sitio, definitivamente debe crear una ventana emergente de lightbox con intención de salida.
Cómo crear una ventana emergente de Lightbox
Ahora que comprende qué es una ventana emergente de caja de luz y por qué querría crear una, ¿cómo se crea una ventana emergente de caja de luz? Recomendamos usar OptinMonster para crear sus ventanas emergentes.

OptinMonster es el kit de herramientas de conversión número 1 en el mundo y lo hemos usado nosotros mismos. OptinMonster hace que sea súper simple crear poderosas ventanas emergentes que conviertan. Y nunca tendrás que usar ningún tipo de codificación.
Incluso escribimos una reseña completa de OptinMonster.
Puede verificar eso o comenzar con su campaña ahora mismo. Todo lo que tiene que hacer es registrarse en OptinMonster y seguir el resto de este artículo.
Paso #1: Crea una Campaña
Dirígete a tu tablero de OptinMonster y presiona el botón Crear :

Seleccione el tipo de campaña Lightbox Popup :


Luego, elija una plantilla de campaña. Puede elegir la plantilla que desee, pero vamos a usar el tipo de campaña Simple para este tutorial.

Ahora, dale un nombre a tu campaña. Recuerde, este nombre de campaña es para usted y probablemente creará un montón de estas ventanas emergentes con diferentes opciones de orientación. Por lo tanto, déle a la campaña un nombre significativo o terminará realmente confundido más adelante.
Además, dependiendo de su plan, también puede usar OptinMonster en múltiples sitios. Por lo tanto, seleccione el sitio web donde desea mostrar su campaña también.

Presione Comenzar a construir cuando haya terminado.
Paso #2: edite su ventana emergente
Con OptinMonster, obtendrá un generador visual de ventanas emergentes de arrastrar y soltar. Una vez que haya terminado de crear su campaña, podrá editar incluso los detalles más pequeños sobre su ventana emergente. Comience editando su título emergente:

La parte más sorprendente aquí es que simplemente haces clic en cualquier texto que quieras editar y lo cambias en línea. No es necesario completar un formulario o editar ningún código HTML en la ventana emergente.
Y luego, ajuste el texto y la apariencia de su botón para crear una clara llamada a la acción:

Cuando esté satisfecho con la apariencia de su ventana emergente, puede pasar a configuraciones más avanzadas.
Paso #3: Establecer reglas de visualización
Las reglas de visualización están destinadas a definir cuándo aparece su campaña en su sitio y quién la ve.

Nuestra recomendación es que cambie la condición de activación a intención de salida:

Haga clic en Siguiente paso para elegir la acción . Aquí, le recomendamos que configure Mostrar la vista de la campaña en Optin View, configure el programa con MonsterEffect en cualquier animación de entrada que desee y reproduzca el efecto de sonido en cualquier efecto de sonido para su ventana emergente.

Y luego, haga clic en el botón Siguiente paso . Puede ver el alcance completo de su configuración en la pestaña Resumen.
Paso #4: Configure su integración de correo electrónico
El siguiente paso es configurar su integración de correo electrónico. Haga clic en Agregar nueva integración en la pestaña Integraciones y seleccione su proveedor de servicios de correo electrónico:

Recomendamos usar Drip para su marketing por correo electrónico si aún no tiene un proveedor de servicios de correo electrónico.
Paso #5: Publique su ventana emergente Lightbox
Cuando crea una nueva campaña, está en pausa de forma predeterminada.
Vaya a la pestaña Publicar del menú superior para ver las Opciones de publicación . Luego, establezca el estado en Publicar y seleccione la plataforma del sitio web:

Si está ejecutando un sitio de WordPress, el complemento OptinMonster maneja el resto de la configuración automáticamente. Es lo mismo para Shopify y BigCommerce. Para cualquier otro sitio, haga clic en Cualquier sitio y pegue el código de inserción en el encabezado de su sitio web:

¡Y tu estas listo!
Terminando
¡Eso es todo por esto, amigos!
Háganos saber si este artículo ayudó. La creación de ventanas emergentes en su sitio puede ayudarlo a convertir su tráfico en suscriptores de correo electrónico y oportunidades comerciales genuinas. Y le recomendamos encarecidamente que comience a crear ventanas emergentes de lightbox de inmediato.
Y si está buscando una forma asequible de aumentar su tráfico, le recomendamos que utilice notificaciones automáticas. Las notificaciones automáticas pueden ayudarlo a atraer más tráfico repetido y participación en el sitio. También puede crear campañas automáticas de notificaciones automáticas que generen ventas.
¿No convencido? Consulte estos recursos:
- 7 estrategias inteligentes para impulsar el compromiso del cliente
- ¿Son efectivas las notificaciones push? 7 estadísticas + 3 consejos de expertos
- Cómo configurar notificaciones automáticas de carritos abandonados (tutorial sencillo)
Recomendamos usar PushEngage para crear sus campañas de notificaciones push. PushEngage es el software de notificaciones push n.º 1 del mundo. Entonces, si aún no lo ha hecho, ¡comience con PushEngage hoy!