Últimas noticias de SeedProd

Tutoriales, consejos y recursos de WordPress para hacer crecer tu negocio

salida popup wordpress

Cómo crear una ventana emergente de intención de salida en WordPress 

Escrito por: avatar de autor Stacey Corrin
avatar de autor Stacey Corrin
Stacey Corrin es una especialista certificada en marketing de contenidos y posicionamiento en buscadores con más de 15 años de experiencia escribiendo sobre WordPress, SEO y marketing digital. Se encarga de gestionar los contenidos de SeedProd y RafflePress, donde aborda herramientas y estrategias que ella misma utiliza y prueba de forma activa.
    
Revisado por: avatar del revisor Turner John
avatar del revisor Turner John
John Turner es el cofundador de SeedProd. Cuenta con más de 20 años de experiencia empresarial y de desarrollo y sus plugins se han descargado más de 25 millones de veces.

En resumen: Cómo crear una ventana emergente de intención de salida en WordPress

Utiliza OptinMonster para añadir una ventana emergente de intención de salida en WordPress que se active cuando los visitantes estén a punto de abandonar la página. Estos son los pasos:

  1. Regístrate en OptinMonster: se requiere un plan Pro o superior para la segmentación por intención de salida.
  2. Crea una campaña emergente: elige una plantilla y ponle un nombre a tu campaña.
  3. Personaliza tu ventana emergente: edita el texto, el color de los botones y el fondo en el editor de arrastrar y soltar.
  4. Establece las reglas de visualización: cambia el desencadenante a «Exit-Intent» y configura la frecuencia con la que se muestra la ventana emergente.
  5. Conecta tu proveedor de correo electrónico: intégralo con Mailchimp, Constant Contact o similares.
  6. Instalar y conectar: instala el plugin de OptinMonster y vincula tu cuenta en WordPress.

La mayoría de los visitantes abandonan tu sitio web sin hacer nada. Una ventana emergente de WordPress que se activa al detectar la intención de salida te ofrece un momento específico para cambiar eso. Solo se activa cuando alguien está a punto de marcharse, por lo que resulta mucho menos molesta que una ventana emergente que aparece en cuanto alguien entra en la página.

En esta guía, te mostraré cómo crear una ventana emergente de salida en WordPress utilizando OptinMonster. Forma parte de la familia de productos de WPBeginner y es la herramienta más fiable que he encontrado para la segmentación por intención de salida en WordPress sin tener que escribir ni una sola línea de código.

¿Qué es una ventana emergente de intención de salida en WordPress?

Una ventana emergente de intención de salida en WordPress es un mensaje que aparece cuando el movimiento del ratón o el comportamiento de un visitante sugiere que está a punto de abandonar su sitio. Estas ventanas emergentes te dan una última oportunidad para captar su atención antes de que salgan.

ejemplo de ventana emergente de intención de salida en WordPress

La mayoría de los propietarios de sitios utilizan ventanas emergentes de intención de salida para ofrecer un descuento, envío gratuito o un imán de clientes potenciales a cambio de la suscripción por correo electrónico. Son especialmente eficaces para reducir el abandono de carritos, impulsar la generación de leads y mantener a los visitantes interesados durante más tiempo.

A diferencia de las ventanas emergentes instantáneas, que aparecen de inmediato, las ventanas emergentes con intención de salida sólo se activan cuando alguien está a punto de marcharse. Este momento las hace menos molestas y más proclives a la conversión.

Cómo crear una ventana emergente de intención de salida en WordPress

Para este tutorial, utilizaré OptinMonster para crear una ventana emergente de intención de salida en WordPress.

Aunque existen otros plugins de ventanas emergentes con intención de salida, OptinMonster es la mejor opción para empresas de todos los tamaños. Es una herramienta de marketing formidable que hace que el crecimiento de su lista de correo electrónico, generando más clientes potenciales, y aumentar las ventas increíblemente sencillo. 

OptinMonster WordPress plugin de página de destino

OptinMonster ofrece muchos tipos de campañas. Entre ellas se incluyen:

  • Ventanas emergentes responsivas
  • Ventanas emergentes de salida
  • Campañas deslizantes
  • Barras de saludo flotantes
  • Alfombras de bienvenida a toda pantalla
  • Widgets de la barra lateral
  • Formularios de contacto

Con OptinMonster, las posibilidades de crear varios popups para su página web son infinitas.

Cada campaña tiene varias plantillas personalizables y compatibles con SEO que puedes editar utilizando el constructor de ventanas emergentes de arrastrar y soltar. Por ejemplo, puedes añadir temporizadores de cuenta atrás, mensajes personalizados, compartir en redes sociales y mucho más.

Además, OptinMonster se integra con varios servicios de marketing por correo electrónico y autorespondedores, como Mailchimp, AWeber, Constant Contact, HubSpot, etc.

Puede obtener más información sobre este potente plugin de popups para WordPress en nuestra detallada reseña de OptinMonster.

Paso 1. Regístrese en OptinMonster Regístrese en OptinMonster

Para empezar, haz clic aquí y da los primeros pasos con OptinMonster.

OptinMonster no ofrece una versión gratuita ni un plan gratuito. Necesitarás como mínimo un plan Pro para poder disfrutar de todas las funciones avanzadas. Consulta la página de precios de OptinMonster para conocer los costes actuales de los planes antes de registrarte.

A continuación, acceda al área de su cuenta de OptinMonster, que tendrá un aspecto similar al del ejemplo siguiente.

crear popup de salida WordPress con optinmonster

Paso 2. Crear una nueva campaña Crear una nueva campaña

El siguiente paso es hacer clic en el botón verde Crear nueva campaña.

Crear una nueva campaña OptinMonster

Al hacerlo, accederá a una pantalla para seleccionar un nuevo tipo de campaña. Dado que desea crear una ventana emergente de salida, elija el tipo de campaña Ventana emergente.

elija el tipo de campaña OptinMonster Popup

A continuación, seleccione una plantilla emergente para empezar.

Plantillas de ventanas emergentes de salida OptinMonster

Las plantillas de campaña de OptinMonster tienen varias opciones de filtrado. Puede filtrar las plantillas por Objetivo, Dispositivo, Categoría e incluso por más reciente.

En nuestro ejemplo, hemos filtrado las plantillas para mostrar las más adecuadas para dirigirse a los visitantes que abandonan, que es uno de los principales objetivos de un formulario opt-in emergente de salida.

filtrar las plantillas de ventanas emergentes de salida para dirigirse a los visitantes que abandonan

Para previsualizar una plantilla, pasa el ratón por encima de la que te guste y haz clic en Previsualizar.

Si estás satisfecho con su aspecto, haz clic en Utilizar plantilla. Se abrirá una ventana emergente para dar un nombre a tu campaña y añadir un sitio web para mostrarla.

Dale un nombre a tu plantilla de ventana emergente de salida y conéctala a un sitio web

Haga clic en Start Building para crear su campaña e ir al constructor de campañas y formularios opt-in de OptinMonster. Verá la plantilla elegida en el creador de ventanas emergentes y accederá a un conjunto casi ilimitado de herramientas para personalizar su ventana emergente de salida.

Ahora puede empezar a personalizar su ventana emergente de salida en el editor de campañas

Paso 3. Personalizar la ventana emergente de intención de salida Personalice su ventana emergente de intención de salida

Personalizar su ventana emergente es fácil.

Con el editor de arrastrar y soltar, puedes cambiar el estilo de la fuente, el color, la alineación, los elementos HTML y mucho más seleccionando cualquier texto y eligiendo tus opciones de personalización.

Edite el texto de la ventana emergente de salida con el editor de texto en línea de OptinMonster

Cambiar el botón de llamada a la acción es igual de sencillo. Haga clic en el botón de su plantilla y seleccione los cambios en el panel izquierdo.

Personalice su botón de llamada a la acción emergente de salida

Incluso puedes añadir una imagen de fondo o un color degradado para que coincida con el estilo y la marca de tu sitio web. Haz clic en el fondo de la ventana emergente y edítalo con las herramientas del panel izquierdo.

Personaliza el fondo de tu ventana emergente de salida

Una vez que la ventana emergente de salida tenga el aspecto deseado, podrá establecer las reglas de visualización.

Paso 4. Elija sus reglas de visualización de ventanas emergentes de intención de salida

Las Reglas de Visualización en OptinMonster utilizan modales Javascript para controlar cuándo se muestra su ventana emergente en su sitio web y quién puede verla.

Haga clic en el botón Reglas de visualización en la parte superior de la pantalla para ver los ajustes disponibles. Su campaña está configurada para mostrarse a todos los visitantes del sitio web después de 5 segundos de aterrizar en su página de forma predeterminada.

Haga clic en el botón Mostrar reglas

Para crear una ventana emergente de salida, cambie la condición "si" por salida detectada.

Elija la condición de salida detectada para su ventana emergente de salida

Para ello, haga clic en el cuadro desplegable, busque "exit" en el cuadro de búsqueda y haga clic en la opción Exit-Intent. Su ventana emergente sólo se mostrará si alguien indica que está a punto de salir de su sitio web.

Haga clic en el botón de paso siguiente

Ahora haga clic en el botón Paso siguiente para elegir una acción para su ventana emergente.

Aquí es donde puedes seleccionar la vista de campaña que quieres que la gente vea. En nuestro caso, queremos que la gente vea nuestra ventana emergente de salida cuando se apruebe el conjunto de reglas.

Elija la vista de campaña Optin para su ventana emergente de intención de salida

Asegúrese de que la opción Optin está seleccionada en el menú desplegable y haga clic en Siguiente paso.

Vea el resumen de su campaña emergente de salida y haga clic en guardar

Ahora verás un resumen de tus reglas de visualización. En este punto, haz clic en el botón verde Guardar para conservar la configuración antes de continuar.

Una cosa que te recomiendo cambiar antes de guardar:

La configuración predeterminada muestra tu ventana emergente en cada visita. Esto acabará cansando rápidamente a los visitantes habituales. Cámbiala a una vez por sesión o una vez cada 30 días para mantener altas las conversiones sin frustrar a quienes vuelven.

También conviene saber que la detección de la intención de salida en dispositivos móviles funciona de manera diferente. La detección en ordenadores de sobremesa se basa en el movimiento del ratón hacia la barra de direcciones del navegador. En las pantallas táctiles no hay cursor, por lo que esa señal no existe.

En el caso del tráfico móvil, OptinMonster utiliza activadores basados en el desplazamiento o en el tiempo. Si la mayoría de tus visitantes acceden desde dispositivos móviles, añade una regla de retraso temporal junto con tu regla de intención de salida para llegar también a ellos.

Paso 5. Integración con su proveedor de correo electrónico

Ahora es el momento de integrar su ventana emergente de salida con su proveedor de servicios de marketing por correo electrónico para gestionar su lista de correo. Así que haga clic en el botón Integraciones en la parte superior de la pantalla.

Elija una integración de correo electrónico para su ventana emergente de salida

A continuación, verás una vista previa de tu ventana emergente y un panel de integraciones en el lado izquierdo. Haz clic en el botón Añadir integración y elige tu proveedor de correo electrónico preferido en el menú desplegable.

Elija una opción de integración en el menú desplegable

Nos integramos con Constant Contact, ya que ofrece una plataforma ligera y fácil de usar adecuada para empresas de todos los tamaños.

Deberá seguir las instrucciones que aparecen en pantalla para conectar su servicio de correo electrónico con OptinMonster.

permitir que optinmonster tenga acceso a su lista de correo electrónico

A continuación, puede elegir una lista de correo electrónico para guardar los nuevos suscriptores cuando optin a través de su popup de salida.

Elija una lista de correo electrónico para guardar los nuevos suscriptores a

Recuerde hacer clic en Guardar antes de pasar al siguiente paso.

Paso 6. Elija cómo publicar su ventana emergente de intención de salida Elija cómo publicar su ventana emergente de intención de salida

Para publicar su ventana emergente de salida, haga clic en el botón Publicar en la parte superior de la pantalla. Podrías hacerlo ahora si no añadiste un sitio web a tu cuenta durante el proceso de configuración.

Añada un nuevo sitio web a su cuenta OptinMonster

Sólo tienes que hacer clic en el botón Añadir un nuevo sitio web, introducir la URL del nombre de tu sitio y hacer clic en Guardar sitio web.

Introduzca los datos de su sitio web

En la sección Vista previa, verá un aviso similar al siguiente.

aviso de sitio no conectado

También puedes utilizar los shortcodes de OptinMonster para añadir popups a tu web.

Eso significa que aún no ha conectado su sitio a OptinMonster. Pero no se preocupe. A continuación, le mostraremos cómo hacerlo utilizando el plugin OptinMonster WordPress.

Paso 7. Instalar el plugin OptinMonster Instale el plugin OptinMonster

Desde la misma página, desplázate hacia abajo hasta que veas los ajustes de la Plataforma. Para publicar tu ventana emergente de salida fácilmente en WordPress, haz clic en la opción WordPress.

Elija la opción de WordPress para publicar su ventana emergente de salida

Al hacerlo, aparecerán las instrucciones para descargar e instalar el plugin OptinMonster para WordPress. Esto le permite conectar su cuenta sin incrustar el código manualmente en WordPress.

Así que haga clic en el botón Descargar para descargar el plugin en su ordenador y siga estas instrucciones para instalar y activar un plugin de WordPress en su sitio web.

Si prefiere añadir el código de incrustación de WordPress manualmente, puede consultar las instrucciones en la documentación para incrustar OptinMonster en su sitio.

Paso 8. Verifique y conecte su cuenta de OptinMonster

Al activar el plugin OptinMonster WordPress, verá una pantalla de bienvenida que le pedirá que conecte su cuenta a WordPress.

Haga clic en el botón conectar su cuenta para conectar OptinMonster a WordPress

Haga clic en el botón Conecte su cuenta, que abre una ventana emergente de OptinMonster. Ahora haga clic en el botón Conectar a WordPress para vincular su cuenta.

Haga clic en el botón Conectar con WordPress

Después de eso, debería ver una lista de sus campañas de OptinMonster en WordPress.

Asegúrese de que el estado de su ventana emergente de salida está configurado como En vivo

Si no ve ninguna campaña, asegúrese de que el estado de la campaña está configurado como Live en el panel de control de su cuenta de OptinMonster.

Actualiza tu lista de Campañas OptinMonster

A continuación, vuelva a su lista de campañas en WordPress y haga clic en el botón Actualizar campañas.

lista de campañas optinmonster en WordPress

Cuando navegue por su sitio web en vivo, su ventana emergente se activará si usted o sus visitantes intentan salir.

OptinMonster exit popup WordPress

¡Felicidades!

Crea la página de la oferta con SeedProd

Tu ventana emergente de OptinMonster recoge el correo electrónico o el clic. Lo que ocurra a continuación es igual de importante. Si tu ventana emergente ofrece un descuento, un incentivo para captar clientes potenciales o un recurso gratuito, la página de destino o la página de agradecimiento a la que redirige debe reforzar esa oferta.

Ahí es donde entra en juego SeedProd. Se trata de un creador visual de sitios web para WordPress que te permite crear páginas de destino y de agradecimiento con una alta tasa de conversión sin tener que tocar el código.

Flujo de suscripción al imán de clientes potenciales en SeedProd

Lo utilizo en mi propia página web para crear páginas que se ajusten a la oferta de la ventana emergente, de modo que los visitantes no tengan la sensación de haber llegado a un sitio cualquiera tras registrarse.

Para ayudarte a dar los primeros pasos, aquí tienes algunas guías:

Ejemplos de ventanas emergentes de intención de salida

Si necesita más inspiración, hemos recopilado una lista de fantásticos ejemplos de ventanas emergentes de intención de salida.

Antes de dar por terminado tu diseño, plantéate realizar una prueba A/B. OptinMonster incorpora pruebas A/B, por lo que puedes probar diferentes titulares, ofertas o colores de botones sin necesidad de recurrir a herramientas de terceros.

Crea dos versiones de tu ventana emergente y deja que OptinMonster distribuya el tráfico entre ellas. Cuando haya recopilado suficientes datos, podrás ver cuál de las dos versiones genera más conversiones. Es una de las mejores formas de mejorar los resultados sin aumentar el tráfico.

Ejemplo de ventana emergente de intención de salida para la construcción de la comunidad

ejemplo de ventana emergente de intención de salida de lista comunitaria

Esta ventana emergente anima a los visitantes a unirse a una comunidad antes de marcharse. El titular en negrita, la lista de viñetas y los logotipos de confianza dejan claro el valor.

Para llevar:

  • Prestaciones breves y escaneables
  • Utilice pruebas sociales (logotipos, testimonios)

Ejemplo de ventana emergente de intención de salida de envío gratuito

Ejemplo de ventana emergente de intención de salida de envío gratuito

Ofrecer el envío gratuito es un fuerte incentivo para completar una compra. Este ejemplo combina un descuento con un formulario de suscripción por correo electrónico.

Para llevar:

  • Recopile correos electrónicos mientras guarda los carritos abandonados
  • Combine un descuento con un envío gratuito

Demo gratuita Ejemplo de ventana emergente de intención de salida

Demo gratuita Ejemplo de ventana emergente de intención de salida

Un texto sencillo y palabras emotivas ("proteger", "más seguro") hacen que esta ventana emergente de demostración resulte persuasiva. El diseño limpio centra la atención en la CTA.

Para llevar:

  • Utilice desencadenantes emocionales en los titulares
  • Diseño minimalista

Ejemplo de ventana emergente de intención de salida de un sorteo

Ejemplo de ventana emergente de intención de salida de un sorteo

Un sorteo puede ser suficiente para que alguien no se vaya. En este caso, la posibilidad de ganar un vale de 50 $ anima a registrarse rápidamente.

Para llevar:

  • Destaque el valor del premio en el titular
  • Ofrecer un fuerte incentivo con poco esfuerzo

Preguntas frecuentes sobre la ventana emergente de intención de salida (FAQ)

¿Cuál es el mejor plugin de ventanas emergentes de intención de salida para WordPress?

OptinMonster es la mejor opción para la mayoría de los sitios web. Incluye la tecnología patentada Exit-Intent®, reglas de visualización avanzadas y se integra con los servicios de marketing por correo electrónico más populares. Forma parte de la familia de productos de WPBeginner, lo que significa que funciona bien junto con herramientas como AIOSEO y WPForms. Si el presupuesto es un problema, Popup Maker es una opción gratuita con funciones de segmentación más limitadas.

¿Las ventanas emergentes de salida ralentizan WordPress?

No, si el plugin está bien programado. OptinMonster se carga de forma asíncrona, por lo que el script de la ventana emergente no impide que se cargue la página. Los problemas de rendimiento son más habituales en plugins gratuitos mal programados que cargan los scripts en el encabezado de la página. Si te preocupa la velocidad, haz una prueba con GTmetrix antes y después de la instalación para comprobar el impacto real.

¿Las ventanas emergentes de intención de salida son malas para el SEO?

Las ventanas emergentes de intención de salida no perjudican directamente al SEO. Las directrices de Google se refieren a las ventanas emergentes que aparecen nada más cargarse la página y que son difíciles de cerrar, sobre todo en dispositivos móviles. Las ventanas emergentes de intención de salida solo se activan cuando alguien está a punto de salir, lo que evita ambos problemas. Asegúrate de que sean fáciles de cerrar y no tendrás ningún problema.

¿Funciona la detección de intención de salida en dispositivos móviles?

La detección estándar de intención de salida (detección de salida del cursor) no funciona en las pantallas táctiles de los dispositivos móviles porque no hay cursor. En los dispositivos móviles, OptinMonster utiliza en su lugar desencadenantes basados en la profundidad de desplazamiento o en el tiempo. Si la mayor parte de tu tráfico proviene de dispositivos móviles, configura una regla de retraso temporal o de profundidad de desplazamiento junto con tu regla de intención de salida para que tu ventana emergente llegue a esos visitantes.

¿Existe algún plugin gratuito de ventanas emergentes de intención de salida para WordPress?

Sí. Popup Maker es una opción gratuita muy popular que admite funciones básicas de detección de intención de salida. Ofrece menos reglas de segmentación y opciones de visualización que OptinMonster, pero resulta adecuado para casos de uso sencillos. Si necesitas pruebas A/B, segmentación avanzada o análisis detallados, necesitarás un plan de pago.

Cree su primera ventana emergente de intención de salida en WordPress

Espero que este artículo te haya ayudado a aprender cómo crear un popup de intención de salida en WordPress. Ahora puedes empezar a recuperar visitantes que abandonan y conseguir más clientes potenciales y ventas para tu negocio.

Si te ha gustado la funcionalidad de arrastrar y soltar de OptinMonster, puede que también te gusten las siguientes guías sin código:

Gracias por leernos. Nos encantaría conocer tu opinión, así que no dudes en unirte a la conversación en YouTube, X y Facebook para obtener más consejos y contenidos útiles para hacer crecer tu negocio.

avatar de autor
Stacey Corrin Especialista en marketing de contenidos
Stacey Corrin es una especialista certificada en marketing de contenidos y posicionamiento en buscadores con más de 15 años de experiencia escribiendo sobre WordPress, SEO y marketing digital. Se encarga de gestionar los contenidos de SeedProd y RafflePress, donde aborda herramientas y estrategias que ella misma utiliza y prueba de forma activa.

Divulgación: Nuestro contenido está apoyado por los lectores. Esto significa que si hace clic en algunos de nuestros enlaces, es posible que ganemos una comisión. Sólo recomendamos productos que creemos que aportarán valor a nuestros lectores.