Elementor Pro POPUPs: Crea tus propias ventajas emergentes con el Constructor de Popups de Elementor

Revisión y Tutorial de Elementor Popup Builder: Formularios de Opt-In facilitados

Si quieres que la gente se una a tu lista de correo electrónico, necesitas preguntarles. Tiene sentido, ¿verdad? No estoy exactamente lanzando bombas de conocimiento sobre ti.

Sin embargo, lo que no es tan obvio es que la forma de preguntar es tan importante como preguntar en primer lugar.

Si lo pides de manera óptima, conseguirás que un mayor porcentaje de personas se apunten a tu lista, lo que significa un mejor retorno de la inversión de tus esfuerzos.

Este post trata sobre cómo puedes hacerlo con un plugin de WordPress llamado Elementor. Aunque tocaré algunos puntos teóricos, esto es más sobre el proceso real paso a paso de usar Elementor para crear varios tipos de formularios popup opt-in en su sitio.

Luego, al final, compartiré algunas ideas sobre si Elementor es la mejor herramienta para su sitio, o si le conviene una opción alternativa.

Cómo Elementor le ayuda a crear formularios de alta conversión para la inclusión voluntaria

Si está familiarizado con Elementor, podría estar diciendo, «hey Colin, Elementor es un constructor de páginas, pensé que estábamos creando formularios emergentes de opción de correo electrónico».

Y habrías tenido razón hasta hace unos meses, que es cuando Elementor lanzó su nueva característica de Popup Builder como parte de Elementor Pro.

Así que ahora, con la versión premium, puedes usar el potente editor visual de arrastrar y soltar de Elementor Pro para crear todo tipo de popups, incluyendo:

• Ventanas emergentes de caja de luz/modal
• Barras de notificación
• Diapositivas
• Rellenos de pantalla
• …mucho más porque tienes control total sobre dónde aparece el lienzo emergente..

Además, podrá conectar estos popups a una serie de servicios de marketing por correo electrónico populares. O, si Elementor no tiene una integración directa para el servicio de marketing por correo electrónico de su elección, puede conectar las cosas al Zapier y conectar de esa manera.

Para obtener acceso a esta funcionalidad, necesitará el complemento de $49 Elementor Pro, así como la versión básica gratuita de Elementor en WordPress.org. Este complemento no sólo incluye la funcionalidad del Popup Builder, sino también la construcción de temas, más widgets y muchas otras características útiles.

Cómo crear ventanas emergentes de alta conversión de correo electrónico con Elementor

Una vez que haya instalado tanto Elementor como Elementor Pro en su sitio web, aquí le mostramos cómo crear sus propios formularios de alta conversión de correo electrónico.

Paso 1: Conéctese al servicio de marketing por email de su elección

Si utiliza uno de los servicios de marketing por correo electrónico para los que Elementor Pro ofrece integraciones directas, lo primero que querrá hacer es conectar Elementor a ese servicio.

Esto asegura que, cuando usted crea su formulario de inscripción de correo electrónico en el siguiente paso, usted puede sincronizarlo hasta sus listas de correo electrónico.

Actualmente, Elementor Pro tiene integraciones directas para:

1. Mailchimp
2. GetResponse
3. ConvertKit
4. ActiveCampaign
5. MailerLite
6. Goteo
7. MailPoet
8. HubSpot

¿Usar un servicio de email marketing diferente? No hay problema Todavía puedes conectar todo a través de Zapier.

Para conectarse a una de las integraciones directas, vaya a Elementor → Ajustes → Integraciones.

Por ejemplo, si utiliza Mailchimp, puede conectarse pegando la clave de la API de Mailchimp:

Paso 2: Crear un nuevo popup y elegir su plantilla

Con ese poco de limpieza de la casa fuera del camino, estás listo para crear tu verdadero correo electrónico opt-in popup.

Para empezar, vaya a Templates → Popups → Add new:

Dale un nombre memorable (esto es puramente interno). A continuación, haga clic en Crear plantilla:

A continuación, puede elegir si desea comenzar con una de las más de 100 plantillas de ventanas emergentes prefabricadas que ofrece Elementor Pro. O bien, puede cerrar la biblioteca de plantillas para empezar desde una pizarra en blanco – cualquiera de los dos está bien.

Personalmente no soy un gran diseñador, así que voy a escoger este bonito popup para este ejemplo. Sin embargo, si prefieres una pizarra en blanco, puedes hacer clic en la X de la esquina superior derecha:

Paso 3: Configurar los ajustes básicos de los pop-ups

En este punto, debería ver una vista previa de su popup – ya sea una pizarra en blanco o la plantilla que usted seleccionó.

Para configurar cómo funciona el lienzo emergente en sí, puede utilizar la Configuración del lienzo emergente, que está abierta de forma predeterminada:

Querrás comprobar las tres pestañas porque esto es lo que te permite crear diferentes tipos de ventanas emergentes. Es decir, al ajustar estos ajustes, podrá crear:

• Popups modales
• Diapositivas
• Barras de notificación
• Etc.

Además, también puede configurar otros ajustes importantes.

En la ficha Opciones, puede:

• Cambiar la altura y el ancho
• Cambiar la posición vertical u horizontal (por ejemplo, podría fijarla en la parte superior o inferior para crear una barra de notificación)
• Decida si desea utilizar una superposición o no (esto le permite, por ejemplo, poner el fondo en gris cuando el popup está activo)
• Desactivar el botón de cierre
• Añadir una animación de entrada

En la pestaña Estilo, puede:

• Cambiar el fondo – ya sea que lo convierta en un color, un gradiente o una imagen
• Configurar la superposición, si está activada
• Configurar el botón de cierre, si está activado

Por último, la pestaña Avanzado contiene algunas configuraciones de importación miscelánea que le permiten:

• Mostrar el botón de cierre o cerrar automáticamente el popup después de X segundos
• Evitar el cierre haciendo clic en la superposición o utilizando la tecla de escape
• Desactivar el desplazamiento de la página
• Evita los popups múltiples (si has apuntado varios popups a la misma página, esto te permite evitar molestar a tus visitantes)

Para darle un ejemplo de cómo estos ajustes afectan a su popup, aquí está lo que parece cambiar la Posición a la esquina inferior derecha:

¿Ves cómo el popup está ahora fijado en la esquina inferior derecha? Si añade una animación de entrada y usa un disparador de desplazamiento, eso crearía un bonito y discreto efecto de deslizamiento.

Paso 4: Diseña tu popup usando el constructor visual de Elementor

Una vez que hayas configurado la configuración básica del Popup, puedes utilizar la interfaz visual, de arrastrar y soltar, para diseñar el contenido real de tu popup.

Puedes usar cualquier widget de Elementor, lo que te da una gran flexibilidad en el diseño. La única cosa que absolutamente debe incluir es el widget de la Forma, ya que esto es lo que le permite crear su forma de opción de correo electrónico.

Con el widget Formulario, puede elegir los campos que desea ofrecer, así como el texto y el aspecto del botón de envío:

Más allá de eso, les animo a explorar todos los widgets y opciones de diseño de Elementor.

Como ya he mencionado, tienes un montón de control sobre cómo se ve todo, y también tienes acceso a algunos widgets útiles que pueden aumentar tu tasa de conversión.

Por ejemplo, podrías usar un..

• Widget de cuenta atrás para añadir urgencia
• Widget de testimonios para añadir una prueba social sobre el valor de su boletín de noticias
• Etc.

Paso 5: Conecte su formulario al servicio de marketing por correo electrónico de su elección

Una vez que haya terminado de diseñar su popup, necesita conectarlo a su servicio de email marketing, ya sea a través de la integración que estableció en el primer paso, o a través de Zapier.

Para ello, abra los ajustes del widget Formulario.

A continuación, encuentre las opciones de Acciones Después de Enviar y añada una acción para el servicio de marketing por correo electrónico de su elección (o Zapier). Por ejemplo, yo uso Mailchimp, por lo que añadiría la acción Mailchimp:

Una vez que añada la acción, obtendrá una nueva área de configuración para ese servicio.

Por ejemplo, puedo elegir la lista Mailchimp a la que me quiero conectar, así como la forma en que quiero asignar la información del formulario a mi lista Mailchimp, y si requiero o no un doble opt-in:

Ahora, cada vez que alguien envía el formulario, Elementor Pro agregará a esa persona directamente a su lista de Mailchimp.

Paso 6: Elija el contenido en el que desea que se muestre su ventana emergente

En este punto, usted está listo para decidir dónde y cuándo desea que se muestre la ventana emergente del formulario de inscripción de correo electrónico.

Para ello, haga clic en el botón Publicar para abrir la Configuración de publicación, que se divide en tres pestañas:

• Condiciones – Le permite mostrar su popup en un contenido específico.
• Disparadores – Le permite elegir cuando aparece su popup.
• Reglas avanzadas – Le permite añadir otras opciones de orientación, como la orientación hacia dispositivos específicos o la referencia de URLs.

En la pestaña Condiciones, haga clic en el botón Agregar condición para agregar una regla para el lugar donde se muestra la ventana emergente.

Por defecto, la regla se establece en Todo el Sitio, pero puede editarla para que sea el objetivo:

• Su página web
• Categorías o etiquetas
• Autores
• Puestos individuales
• Páginas de archivo (como la lista de tu blog)

También puede agregar múltiples reglas y elegir entre Incluir/Excluir, lo que le da muchas más opciones:

Una forma útil de utilizar estas opciones para aumentar la tasa de conversión es personalizar las ventanas emergentes.

Por ejemplo, digamos que tienes dos categorías de entradas de blog – una sobre «Blogging» y otra sobre «WordPress».

Con estas reglas, podría crear dos ventanas emergentes personalizadas independientes para cada categoría con un CTA dirigido a ese tipo de contenido. Incluso algo tan simple como duplicar el mismo diseño, pero cambiando ligeramente el texto para dirigirlo hacia la categoría, puede dar dividendos.

Paso 7: Elegir las reglas de activación

A continuación, ve a la pestaña de Disparadores para determinar cuándo lanzar tu popup. Puedes activar tu popup por:

• Hora
• Profundidad de desplazamiento
• Inactividad
• Haga clic en
• Intención de salida

Para hacer que su popup sea menos molesto, puede utilizar estas reglas para retrasar su visualización – más sobre esto en un segundo.

Paso 8: Configurar reglas avanzadas

Finalmente, diríjase a las Reglas Avanzadas para configurar algunas otras opciones importantes.

Aquí, tienes opciones que te permiten:

• Esperar un cierto número de vistas de página o sesiones para mostrar su ventana emergente
• Establezca un límite para el número de veces que un visitante ve un popup
• Dirigir los visitantes que vienen de referentes específicos
• Oculte la ventana emergente para los usuarios que hayan iniciado sesión
• Oculte para ciertos dispositivos, como ocultar su popup para los visitantes móviles

Para no molestar a sus visitantes, le recomiendo que active definitivamente la opción Mostrar hasta X veces.

Además, la opción Al llegar desde una URL específica abre más posibilidades de personalización. Por ejemplo, si consigues un post de invitado en un blog popular, podrías crear un correo electrónico especial con opción de entrada dirigido a los visitantes que llegan a tu sitio desde ese post de invitado.

Una vez que haya terminado de configurar la configuración de publicación, haga clic en el botón Guardar y Cerrar para que su correo electrónico aparezca en una ventana emergente en vivo.

Cómo evitar que los visitantes se molesten con su correo electrónico opt-in popup

No necesitas que te diga que, si se hace mal, los popups de opción de correo electrónico pueden ser súper molestos.

Estoy seguro de que has experimentado el sitio que te molesta incesantemente con los popups, haciendo que pulsar el botón «atrás» de tu navegador sea una opción bastante atractiva.

Aquí hay algunas maneras en las que puede usar las opciones de Elementor Pro para evitar que los visitantes de su sitio pasen por eso:

• Considere la posibilidad de crear un tipo de ventana emergente menos intrusiva, como una barra de notificación o un slide-in no modal. Puede controlarlo mediante las opciones de la ventana de diálogo.
• Asegúrate de que tu ventana emergente no se muestre de inmediato. Puede retrasarlo con un disparador de salida, o puede usar la opción Mostrar después de x vistas de página en las Reglas Avanzadas para esperar hasta que un visitante vea varias páginas (¡o incluso ambas!).
• Utilice la opción Mostrar hasta X veces en las Reglas Avanzadas para establecer un límite en el número de veces que un visitante verá el popup.
• Facilita el cierre del popup asegurándote de que el botón Cerrar esté visible y sea fácil de hacer clic. Puede controlar esto en la Configuración del Popup.
• Evite mostrar varias ventanas emergentes en la misma página. Una vez más, puede configurar esto desde la Configuración del Popup.

¿Es Elementor Pro Popup Builder el mejor plugin de popup para opt-ins de correo electrónico?

Elementor Pro definitivamente no es el único plugin que le ayuda a construir su lista de correo electrónico.

Así que para terminar este post, vamos a profundizar en la cuestión de si Elementor Pro Popup Builder es la mejor manera de crear popups de opción de correo electrónico en todas las situaciones.

La respuesta depende de lo que más valora.

Empecemos con las partes buenas..

Puntos fuertes de Elementor Pro Popup Builder

Cuando se trata de flexibilidad de diseño, no creo que encuentres ninguna herramienta que te dé más control sobre el diseño de tus popups y formularios opt-in de correo electrónico.

Dado que Elementor es una herramienta para diseñar todo tipo de contenido web, incluyendo tanto páginas de destino como sitios web completos, tiene muchas opciones de diseño. Es más, incluso entre los constructores de páginas de WordPress, Elementor todavía se destaca por su asombrosa variedad de opciones de diseño.

Por lo tanto, si valoras la capacidad de diseñar popups 100% únicos, Elementor Pro es una opción sólida.

Además, también tienes acceso a todos los widgets regulares de Elementor, lo que también te da mucha flexibilidad cuando se trata del contenido de tus formularios opt-in. Por ejemplo, se puede incorporar fácilmente:

• Temporizadores de cuenta atrás
• Imágenes
• CTAs
• Etc.

Y también hay toneladas de extensiones gratuitas y premium de Elementor que añaden aún más widgets para que los utilices.

Por último, también obtiene muchas opciones de orientación útiles que le permiten crear formularios personalizados de inscripción de correo electrónico, que es una gran manera de aumentar sus tasas de conversión.

Básicamente, cuando se trata de los formularios de inscripción en la parte delantera, Elementor Pro es la mejor opción.

Puntos débiles de Elementor Pro Popup Builder

Sin embargo, hay un área entre bastidores donde Elementor Pro se queda corto..

Analítica.

Es decir, ¡no hay ninguno! Al menos no está incorporado.

Así que mientras que la mayoría de las otras herramientas de correo electrónico le permitirán realizar un seguimiento de las impresiones y conversiones para calcular su tasa de conversión, Elementor no ofrece eso… al menos no sin algo de ayuda.

Hay soluciones alternativas para añadir el seguimiento de Google Analytics, y encontré este plugin WordPress Elementor Tracker en CodeCanyon que añade el seguimiento de eventos como una opción para todos los widgets de Elementor. Aunque nunca he utilizado personalmente este plugin, parece que te permitiría ver tu tasa de conversión en Google Analytics sin demasiados problemas.

Pero lo esencial es que la analítica no es el punto fuerte de Elementor, así que ese es el precio que se paga por toda esa flexibilidad de diseño.

Y, tampoco hay ninguna prueba A/B incorporada. Así que, de nuevo, no tiene una forma incorporada de analizar y optimizar sus formularios en comparación con los demás.

Sólo tú puedes decidir si esas compensaciones valen la pena