Popup Builder de Elementor permite crear ventanas emergentes completamente editables y decidir dónde, cuándo y con qué frecuencia aparecen mediante Conditions, Triggers y Advanced Rules. Esto permite utilizar un Popup Elementor para formularios, promociones, suscripciones, llamados a la acción, avisos o confirmaciones sin instalar un plugin diferente para cada caso.

Pero mostrar más ventanas no significa conseguir más contactos.

Una ventana emergente puede facilitar una acción cuando aparece después de que el usuario ha demostrado interés. También puede provocar exactamente lo contrario si cubre la pantalla nada más entrar, reaparece continuamente o resulta difícil cerrarla desde un celular.

Por eso, cuando hablamos en este artículo de popups “que conviertan”, nos referimos a ventanas diseñadas para facilitar una conversión, no a garantizar resultados.

El objetivo de un popup no es obligar al visitante a prestar atención. Es presentar una acción relevante en el momento adecuado sin bloquear innecesariamente el contenido que vino a consultar.

¿Qué es Popup Builder de Elementor?

Popup Builder es una herramienta de Elementor Pro que permite diseñar ventanas emergentes utilizando el propio editor visual de Elementor.

Dentro de un popup puedes incorporar elementos como:

• Títulos.
• Textos.
• Imágenes.
• Botones.
• Formularios.
• Vídeos.
• Iconos.
• Menús.
• Otros widgets compatibles.

Además del contenido, Elementor permite controlar el ancho y alto, posición horizontal y vertical, overlay, botón de cerrar, animaciones de entrada y salida y distintas opciones avanzadas.

Después entra en juego una fórmula fundamental:

Dónde aparece → Conditions

Cuándo aparece → Triggers

Qué requisitos adicionales debe cumplir → Advanced Rules

La documentación oficial actualizada el 27 de agosto de 2026 confirma que Popup Builder y estas reglas están disponibles en Elementor Pro Advanced Solo, Advanced y planes superiores compatibles, mientras el plan Essential no incluye Popup Builder.

Elementor Free vs Elementor Pro

Función	Elementor Free	Elementor Pro compatible
Crear páginas	Sí	Sí
Form Builder	No en Free	Sí
Popup Builder	No	Sí, desde planes Advanced compatibles
Conditions	No	Sí
Triggers	No	Sí
Advanced Rules	No	Sí
Form Submissions	No	Sí en planes compatibles
Theme Builder	No	Sí

Elementor mantiene actualmente Form Builder en planes Pro, mientras funciones como Popup Builder, Form Submissions e integraciones avanzadas dependen del nivel contratado.

Este tutorial utiliza funciones de Elementor Pro. La disponibilidad exacta depende del plan activo en el momento de realizar la configuración.

Cómo crear un popup básico paso a paso

El flujo actual puede resumirse así:

1. Entra al escritorio de WordPress.
2. Ve a Elementor > Editor > Templates > Popups.
3. Selecciona Add New Popup.
4. Asigna un nombre.
5. Pulsa Create Template.
6. Selecciona una plantilla prediseñada o comienza desde cero.
7. Diseña el contenido con Elementor.
8. Abre los ajustes del popup y configura Width, Height, posición, Overlay, Close Button y animaciones.
9. Pulsa Publish.
10. Configura Conditions.
11. Configura Triggers.
12. Configura Advanced Rules.
13. Guarda.
14. Prueba el resultado en el frontend.

La documentación actual mantiene este flujo y señala que, al publicar por primera vez, Elementor abre las condiciones de visualización para continuar con triggers y reglas avanzadas.

Conditions vs Triggers vs Advanced Rules

Esta diferencia es la base para utilizar bien Popup Builder.

Función	Responde	Ejemplo
Conditions	¿Dónde?	Solo página de un servicio
Triggers	¿Cuándo?	Después de hacer scroll
Advanced Rules	¿Bajo qué requisito adicional?	Después de varias páginas vistas
Manual Trigger	¿Qué elemento lo abre?	Botón “Solicitar cotización”

Conditions

Determinan en qué páginas puede aparecer.

Por ejemplo:

• Todo el sitio.
• Inicio.
• Páginas concretas.
• Entradas.
• Categorías.
• Tags.

Triggers

Definen acciones del usuario que disparan automáticamente la ventana.

Elementor mantiene actualmente:

• On Page Load.
• On Scroll.
• On Scroll To Element.
• On Click.
• After Inactivity.
• On Page Exit Intent.

Advanced Rules

Añaden requisitos como:

• Mostrar después de X páginas vistas.
• Mostrar después de X sesiones.
• Limitar cuántas veces aparece.
• Mostrar según URL de procedencia.
• Mostrar según origen interno, externo o buscador.
• Ocultar a usuarios conectados o roles concretos.
• Mostrar únicamente en desktop, tablet o móvil.

Los principales Triggers disponibles

On Page Load: abre el popup después de cargar la página, con posibilidad de introducir un retraso.

On Scroll: aparece cuando el visitante ha recorrido una determinada cantidad de la página.

On Scroll To Element: espera a que el usuario alcance un elemento identificado.

On Click: se activa tras determinado número de clics.

After Inactivity: aparece después de cierto tiempo sin interacción.

On Page Exit Intent: intenta detectar intención de salida mediante el comportamiento del cursor.

No existe un trigger universalmente superior. El mejor depende del objetivo y del momento en que la propuesta aporta valor.

Popup Elementor: 9 formas efectivas de utilizarlo

1. Abrir un formulario de cotización cuando el usuario hace clic

Objetivo: facilitar el contacto sin obligar a abandonar la página de servicio.

Imagina un botón:

Solicitar cotización

Al pulsarlo, aparece un formulario con:

• Nombre.
• Email.
• Teléfono.
• Servicio.
• Mensaje corto.

Configuración recomendada:

• Condition: únicamente las páginas donde realmente se utiliza.
• Apertura: manual.
• Método sencillo dentro de Elementor: Dynamic > Actions > Popup > Open Popup.
• Otra alternativa: Open By Selector, cuando necesitas abrirlo desde un elemento con clase o ID específico.

Una ventaja del trigger manual es que la persona pidió expresamente ver el contenido.

Elementor aclara además que cuando se utiliza Open By Selector, los Triggers y Advanced Rules automáticos se ignoran, porque la apertura depende directamente del clic.

Precaución: no abras simultáneamente el mismo formulario automáticamente.

Mide: clic en el CTA, inicio del formulario, formulario enviado y generate_lead solamente cuando efectivamente se genera el cliente potencial.

2. Mostrar una oferta o ayuda mediante Exit Intent

Objetivo: presentar una última acción cuando un visitante parece abandonar una página relevante.

Ejemplo:

¿Necesitas ayuda antes de irte?

Botón:

Hablar con un asesor

No necesitas convertir cada Exit Intent en:

“¡10 % DE DESCUENTO SOLO AHORA!”

si el descuento no forma parte de la estrategia real.

Configuración:

• Condition: páginas de servicio o producto relevantes.
• Trigger: On Page Exit Intent.
• Advanced Rule: limitar frecuencia.

Elementor mantiene Exit Intent dentro de sus triggers y sus ejemplos oficiales lo utilizan para popups opt-in.

Precaución: la intención de salida depende especialmente del movimiento del cursor, por lo que el comportamiento en dispositivos táctiles no equivale al de escritorio.

No construyas toda la estrategia móvil alrededor de Exit Intent.

Mide: aperturas, clics, leads y cierre del popup.

3. Mostrar una ventana después de cierto porcentaje de scroll

Objetivo: esperar hasta que el usuario haya consumido suficiente contenido antes de pedir una acción.

Puede funcionar en:

• Artículos.
• Páginas educativas.
• Servicios extensos.
• Estudios o casos de éxito.

Por ejemplo, después de avanzar una parte considerable de un artículo puedes mostrar:

¿Quieres recibir una evaluación de tu página?

Configuración:

• Condition: artículo o categoría relevante.
• Trigger: On Scroll.
• Direction: Down.
• Porcentaje: basado en el comportamiento y longitud del contenido.

Elementor permite configurar el porcentaje de desplazamiento para activar el popup.

No existe un “60 % perfecto”.

Una página muy corta y un artículo de 4.000 palabras necesitan decisiones diferentes.

Precaución: no interrumpas justo cuando el usuario comienza a leer.

Mide: scroll previo, popup view, CTA y envío.

4. Abrir el popup cuando el visitante llega a una sección concreta

Objetivo: relacionar la ventana con el contenido que el usuario acaba de consultar.

Supongamos que la página contiene:

Planes

Cuando el visitante llega al final de esa sección, aparece:

¿Quieres ayuda para elegir el plan adecuado?

Elementor mantiene On Scroll To Element como trigger. El elemento objetivo debe identificarse mediante un selector o CSS ID que coincida con el configurado en el popup.

Configuración:

• Condition: página correspondiente.
• Trigger: On Scroll To Element.
• Selector: ID o clase del elemento relevante.

No necesitas aprender CSS avanzado para este caso; basta con asignar correctamente un identificador.

Precaución: verifica que la sección realmente sea un momento lógico para interrumpir.

Mide: usuarios que llegan a esa zona, aperturas y contactos.

5. Mostrar el popup solo después de varias páginas vistas

Objetivo: esperar a que el visitante demuestre mayor interés antes de solicitar sus datos.

Ejemplo:

El usuario visita:

Inicio → Servicio → Caso de éxito.

Entonces aparece:

¿Quieres hablar con un especialista?

Elementor mantiene Show After X Page Views entre sus Advanced Rules. También permite Show After X Sessions para esperar visitas recurrentes.

Un tutorial oficial de suscripción muestra precisamente cómo lanzar un formulario después de varias páginas vistas, aunque el número utilizado en ese ejemplo no debe convertirse en regla universal.

Configuración:

• Conditions: zonas donde el mensaje tenga sentido.
• Trigger: por ejemplo Page Load con retraso.
• Advanced Rule: Page Views o Sessions.

Precaución: no asumas que tres páginas significan automáticamente intención de compra.

Mide: leads de visitantes nuevos frente a recurrentes.

6. Personalizar el mensaje según la procedencia del visitante

Objetivo: adaptar el contexto sin crear una landing diferente para cada fuente.

Advanced Rules permite actualmente:

• When arriving from specific URL.
• Mostrar según llegada desde buscadores.
• Enlace externo.
• Enlace interno.

Ejemplo:

Una página recibe tráfico desde una campaña para inmobiliarias.

Puedes mostrar:

¿Buscas mejorar la presencia digital de tu inmobiliaria?

en lugar de un CTA completamente genérico.

Configuración:

• Condition: landing correspondiente.
• Trigger: scroll, page load retrasado o interacción.
• Advanced Rule: procedencia.

Precaución: el referrer puede no estar disponible en todos los escenarios por navegadores, redirecciones o políticas de privacidad.

No lo utilices para inferir información sensible.

Mide: conversión por fuente o campaña correctamente etiquetada.

7. Mostrar una experiencia diferente según dispositivo

Objetivo: evitar trasladar literalmente un modal de escritorio a un teléfono.

Elementor mantiene Show on Devices para Desktop, Tablet y Mobile dentro de Advanced Rules.

Por ejemplo:

Desktop: popup centrado.

Móvil: no mostrarlo o utilizar una barra inferior más compacta.

Un diseño de escritorio puede provocar en teléfono:

• Botón de cerrar fuera de pantalla.
• Formularios demasiado estrechos.
• Textos cortados.
• Scroll interno incómodo.
• Pantalla completamente cubierta.

Configuración:

• Advanced Rule: dispositivos.
• Ajustes responsive propios para Width, Height, Padding, tipografía y formulario.

Precaución: ocultar el popup móvil no significa necesariamente que el CTA deba desaparecer. Puedes presentarlo dentro de la página o con otra solución.

Mide: resultados y cierres por dispositivo.

8. Mostrar una confirmación después de enviar un formulario

Objetivo: explicar claramente qué ocurre después de captar el lead.

Elementor Forms permite utilizar:

Actions After Submit → Popup

y escoger:

• Open Popup.
• Close Popup.

Ejemplo:

Formulario enviado → cerrar ventana del formulario → abrir:

Gracias. Recibimos tu solicitud.

Después puedes mostrar:

• Próximo paso.
• Botón a WhatsApp.
• Link de agenda.
• Recurso útil.

No conviertas cada confirmación en una venta adicional agresiva.

Mide: generate_lead en el envío exitoso, no simplemente cuando aparece el popup. Google recomienda este evento cuando realmente se ha generado un lead, por ejemplo mediante un formulario.

9. Utilizar una Bottom Bar para promociones y avisos

Objetivo: llamar la atención sin cubrir el contenido principal.

No todas las ventanas tienen que ser modales centrados.

Una Bottom Bar, barra superior o pequeño slide-in puede funcionar para:

• Eventos.
• Anuncios.
• Promociones.
• Horarios especiales.
• Nuevo servicio.
• CTA secundario.

Elementor mantiene ejemplos oficiales de Bottom Bars y fly-ins, donde la posición, overlay, frecuencia y dispositivos pueden configurarse desde Popup Builder.

Este formato es especialmente útil en móvil cuando un modal grande sería excesivo.

Precaución: una barra tampoco debe cubrir navegación, botones flotantes o controles importantes.

Mide: impresiones, clics y acciones posteriores.

Tabla resumen de las 9 formas

Objetivo	Trigger / regla	Formato inicial
Cotización	Click manual	Modal
Evitar abandono	Exit Intent	Modal pequeño
Captar lead en contenido	Scroll	Modal / slide-in
CTA contextual	Scroll To Element	Modal
Visitante interesado	Page Views / Sessions	Modal
Campaña específica	URL / Referrer	Popup contextual
Experiencia móvil	Device Rule	Bottom Bar
Confirmación	After Submit	Modal
Aviso o promoción	Page Load controlado	Bottom Bar

Esta tabla es una orientación. El formato final debe responder al comportamiento real del sitio.

Cómo diseñar una ventana que no parezca publicidad molesta

Un popup comercial efectivo suele tener un objetivo principal.

Buenas prácticas:

• Título directo.
• Texto breve.
• Un CTA predominante.
• Contraste suficiente.
• Imagen únicamente si aporta contexto.
• Botón de cerrar visible.
• Espacio interior adecuado.
• Formulario corto.
• Sin navegación innecesaria.
• Sin cuatro botones compitiendo.

Evita:

“¡ESPERA! ¡NO TE VAYAS! ¡OFERTA ÚNICA!”

cuando no existe una urgencia real.

Una alternativa mucho más coherente para una empresa de servicios:

¿Necesitas ayuda para elegir el servicio adecuado?

Hablar con un asesor

El popup debería resolver una duda o facilitar una acción, no gritar más fuerte que el resto de la página.

¿Cuántos campos debería tener un formulario dentro del popup?

Para un primer contacto, pide únicamente aquello que necesitas.

Por ejemplo:

• Nombre.
• Email o teléfono.
• Necesidad principal.

No conviertas automáticamente una ventana pequeña en un formulario con:

• Dirección.
• Empresa.
• Presupuesto.
• Fecha.
• Documento.
• Diez preguntas adicionales.

Cuando la solicitud realmente necesita más información, puede ser preferible utilizar un formulario multipaso o llevar al visitante a una página específica.

Cómo limitar la frecuencia

La frecuencia es una de las herramientas más importantes y más ignoradas.

Elementor mantiene Show Up To X Times, con opciones para contar las apariciones al abrir o al cerrar. La información se guarda mediante Local Storage. También existen configuraciones asociadas a sesiones y periodos según las funciones vigentes.

Una persona que ya cerró repetidamente una ventana no necesita verla de nuevo cada treinta segundos.

No existe una frecuencia universal.

Evalúa:

• Tipo de mensaje.
• Duración de la visita.
• Recurrencia del usuario.
• Valor de la oferta.
• Momento del recorrido.

Un formulario de cotización abierto mediante clic no necesita el mismo límite que una promoción automática.

Popup y caché

Algunas reglas dinámicas pueden interactuar mal con determinadas estrategias de caché.

Elementor advierte específicamente que Hide for logged in users puede no funcionar correctamente en sitios con caché.

Si una condición muestra resultados incorrectos:

1. Prueba en incógnito.
2. Limpia caché del sitio.
3. Purga CDN cuando corresponda.
4. Compara usuario conectado y desconectado.
5. Revisa Conditions y Advanced Rules.
6. No desactives toda la caché como primera medida.
7. Consulta al hosting si necesitas exclusiones específicas.

Popups y SEO: evita intersticiales invasivos

Google no dice que “todos los popups sean malos para SEO”.

El problema son los intersticiales y diálogos invasivos que impiden acceder al contenido.

Google recomienda evitar especialmente ventanas promocionales que:

• Aparecen inmediatamente.
• Cubren toda la página.
• Obligan a interactuar antes de leer.
• Son difíciles de cerrar.
• Dificultan la experiencia móvil.

También recomienda, cuando sea posible, utilizar banners que ocupen solo una fracción de la pantalla en lugar de bloquear todo el contenido.

Determinados intersticiales obligatorios por razones legales o regulatorias pueden recibir un tratamiento distinto.

El problema no es la existencia de una ventana emergente por sí sola, sino cómo interrumpe el acceso al contenido.

Un trigger por clic o después de cierta interacción suele ser mucho menos intrusivo que mostrar un modal enorme apenas se abre la página.

Accesibilidad de una ventana emergente

Una ventana bonita que una persona no puede cerrar sigue siendo una mala ventana.

Los patrones de accesibilidad de WAI recomiendan que un diálogo modal:

• Tenga un propósito claramente identificable.
• Mantenga el foco de teclado dentro del diálogo mientras esté abierto.
• Incluya un control visible para cerrarlo.
• Permita navegación mediante Tab y Shift + Tab.
• Utilice Escape para cerrar cuando el flujo lo permita.
• Devuelva el foco al elemento que lo abrió cuando sea posible.

Un botón que visualmente sea solo una “X” debería tener un nombre accesible equivalente a:

Cerrar

Además, revisa:

• Contraste.
• Tamaño del texto.
• Orden de foco.
• Formularios.
• Mensajes de error.
• No depender únicamente del color.

Cómo hacer un Popup Elementor responsive

Revisa independientemente para desktop, tablet y móvil:

• Width.
• Height.
• Padding.
• Margin.
• Tipografía.
• Imágenes.
• Formulario.
• Botón principal.
• Close Button.
• Overlay.
• Scroll interno.

Elementor permite configurar tamaño, posición, overlay y botón de cierre desde los ajustes del popup.

Prueba:

• Celular pequeño.
• Celular grande.
• Tablet.
• Orientación vertical.
• Horizontal.

No utilices automáticamente 100vw × 100vh.

Elementor permite crear full-screen popups y documenta configuraciones específicas para ello, pero esa posibilidad técnica no significa que deba ser la opción predeterminada.

Cómo medir si realmente genera contactos

No evalúes solo:

“Se ve bien.”

Analiza:

• Popup views.
• Clics.
• Cierres.
• Inicio de formulario.
• Formulario enviado.
• Leads.
• Clics en WhatsApp.
• Reservas.
• Compras cuando corresponda.

Elementor no necesariamente registra automáticamente todo ese embudo.

Puede necesitarse:

• Google Analytics 4.
• Google Tag Manager.
• Eventos personalizados.
• Elementor Submissions.

Para captación de clientes potenciales, Google recomienda generate_lead cuando realmente se genera un lead, por ejemplo tras una solicitud o formulario exitoso. No debe dispararse por el simple hecho de abrir la ventana.

Embudo conceptual

Visita

→ página de servicio

→ interacción

→ popup

→ CTA / formulario

→ generate_lead

→ oportunidad comercial

La ventana es solo una etapa.

El objetivo final sigue siendo el contacto, reserva, compra o acción comercial correspondiente.

A/B testing: qué vale la pena comparar

Cuando dispongas de una herramienta adecuada, puedes comparar:

• Título.
• CTA.
• Momento de apertura.
• Cantidad de campos.
• Imagen.
• Modal vs Bottom Bar.
• Scroll vs clic.
• Frecuencia.

No cambies simultáneamente título, diseño, formulario, trigger y audiencia si después quieres saber qué produjo la diferencia.

Trabaja con una hipótesis concreta y suficiente volumen antes de extraer conclusiones.

Errores frecuentes con Popup Builder

Mostrarlo inmediatamente: interrumpe antes de que el usuario conozca la página.

Activarlo en todo el sitio: puede hacer irrelevante el mensaje.

No configurar Conditions: aparece donde no corresponde.

No configurar Trigger: una ventana automática puede no abrirse.

Olvidar el trigger manual: el botón parece no funcionar.

No limitar frecuencia: genera fatiga.

Popup gigante en móvil: bloquea la navegación.

Botón cerrar pequeño u oculto: deteriora UX y accesibilidad.

Dos ventanas simultáneas: compiten entre ellas y con la página.

Formulario demasiado largo: convierte una acción simple en un proceso pesado.

Exit Intent en todas las páginas: añade una interrupción sistemática.

Fullscreen sin motivo: bloquea contenido innecesariamente.

Demasiadas animaciones: distraen y pueden empeorar experiencia.

Urgencia falsa: reduce confianza.

No medir: no sabes si aporta negocio.

Ignorar caché: algunas reglas pueden mostrarse incorrectamente.

No probar como visitante: el administrador puede ver un comportamiento distinto.

No probar móvil: descubres errores cuando ya está publicado.

Ignorar accesibilidad: excluye usuarios.

Usar popups para información esencial: obliga al visitante a abrir una ventana para obtener algo que debería estar visible.

Pensar que Elementor Free incluye Popup Builder: la función requiere un plan Pro compatible.

¿Cuándo NO deberías utilizar un popup?

No es la mejor herramienta para:

• Precio principal.
• Navegación básica.
• Información esencial de un servicio.
• Contenido que debe consultarse repetidamente.
• Datos legales importantes.
• Información de contacto principal.
• Formularios extremadamente largos.

En esos casos puede funcionar mejor:

• Una sección fija.
• Una landing.
• Una página independiente.
• Un botón.
• Una barra discreta.

Popup vs sección fija

Popup	Sección fija
Capta mucha atención	Siempre disponible
Depende de un trigger	Forma parte natural del recorrido
Puede interrumpir	Interrumpe menos
Útil para CTA contextual	Mejor para información esencial
Necesita controlar frecuencia	No necesita frequency cap

La elección depende del papel de ese contenido dentro del recorrido.

Una página profesional utiliza popups como parte del recorrido comercial

Una ventana emergente aislada no arreglará una página que:

• Carga lentamente.
• No explica bien el servicio.
• Tiene una propuesta de valor débil.
• Se ve mal en móvil.
• No mide contactos.
• No facilita la navegación.

En Codwelt desarrollamos diseño de páginas web profesionales administrables con WordPress + Elementor.

Según el plan contratado, la página puede incorporar diseño profesional alineado con la marca, adaptación a celulares y tablets, hosting avanzado, dominio, SSL, seguridad, optimización de rendimiento, Google Analytics, Google Search Console, WhatsApp, blog, SEO + IA y capacitación. La página actual también señala que licencias premium, incluida Elementor Pro, forman parte de determinados planes y alcances, no de todos.

Un popup funciona mejor cuando complementa una página clara, rápida y orientada a una acción comercial concreta.

Solicita tu página web profesional preparada para generar y medir oportunidades comerciales.

Preguntas frecuentes

Conclusión

Las nueve formas principales de utilizar Popup Elementor son:

1. Apertura por clic.
2. Exit Intent.
3. Scroll.
4. Scroll To Element.
5. Page Views o Sessions.
6. Procedencia del visitante.
7. Reglas por dispositivo.
8. Popup después de un formulario.
9. Bottom Bar para avisos y promociones.

La efectividad de una ventana emergente depende menos de cuánto llame la atención y más de qué tan relevante sea para el usuario en ese momento.

Utiliza Conditions para decidir dónde, Triggers para decidir cuándo y Advanced Rules para controlar frecuencia y contexto. Después mide lo que sucede.

Convierte tus llamados a la acción en oportunidades comerciales sin perjudicar la experiencia del usuario. Cotiza tu página web profesional con Codwelt.

Fuentes

Codwelt

Codwelt — Diseño de páginas web profesionales

Elementor

Elementor — Popups

Elementor — Conditions, Triggers and Advanced Rules

Elementor — Create a Popup

Elementor — Trigger a Popup on a Link Click

Elementor — Open a Popup After Form Submission

Elementor — Actions After Submit

Elementor — Subscribe Form Popup

Elementor — Full Screen Popup

Elementor — Bottom Bar Popup

Elementor — Exit Intent / Classic Opt-in

Google Search Central

Google — Evitar intersticiales y diálogos invasivos

Google Analytics

Google Analytics — Recommended Events

W3C / WAI

WAI — Modal Dialog Pattern