¿Qué es un formulario pop-up?
Un formulario pop-up o formulario emergente suele ser una pequeña ventana con un mensaje que aparece mientras un visitante navega por tu sitio web. Son una excelente manera de promocionar tu newsletter y recoger suscriptores.
Cómo crear un formulario emergente
Para crear un formulario popup:
Ve a la página Formularios.
Haz clic en la pestaña Pop-ups.
Haz clic en Crear formulario.
Nombra tu ventana pop-up y asegúrate de que el tipo de formulario: El Pop-up se selecciona.
Haz clic en Guardar y continuar.
Selecciona al menos un grupo para tu formulario pop-up. Cuando los suscriptores completen tu formulario emergente, se agregarán al grupo que selecciones aquí.
Haz clic en Continuar.
Selecciona una plantilla de formulario pop-up. Una vez seleccionado, se abrirá el editor de formularios pop-up.
9. Edita el encabezado y el texto de tu formulario emergente haciendo clic en el bloque que deseas editar y escribiendo directamente en el bloque de tu formulario emergente.
10. Cambia la imagen en tu formulario pop-up haciendo clic en el bloque de imagen y luego haciendo clic en la imagen en la barra lateral.
11. Haz clic en el bloque de formulario de suscripción para editarlo en la barra lateral. Para editar el campo de entrada, haz clic en el icono del lápiz junto al campo que deseas editar.
12. Edita la página de éxito de tu formulario emergente haciendo clic en el botón Éxito a lo largo de la barra de navegación superior.
13. Una vez que hayas terminado de editar tu formulario, haz clic en Siguiente para salir del editor de formularios y aplicar algunos ajustes a tu formulario pop-up.
Cómo aplicar ajustes a un formulario pop-up
Estas configuraciones son las reglas que aplicas a tu formulario emergente y que determinan cuándo y dónde aparece.
Hay cuatro factores en el comportamiento de tu formulario a los que debes aplicar ajustes:
Disparador - Elige cuándo aparecerá tu formulario emergente. Por ejemplo, cinco segundos después de abrir la página, cuando el visitante se desplaza al 50% de la página web, o cuando el visitante tiene la intención de salir de la página.
Frecuencia - Elige la frecuencia con la que aparece tu pop-up para el mismo visitante si no se suscribe la primera vez que ve el pop-up.
Programar - Haz que tu ventana emergente entre en funcionamiento inmediatamente o establezca una fecha de inicio y una fecha de finalización para tu formulario pop-up.
Visibilidad - Elige si quieres ocultar tu pop-up en dispositivos específicos, u ocultar/mostrar tu pop-up en páginas web específicas.
Una vez que estés satisfecho con la configuración de comportamiento de tu ventana emergente, haz clic en Guardar y continúa con el siguiente paso: instalar tu formulario pop-up.
Cómo instalar un formulario pop-up en tu sitio web
Para instalar el formulario emergente en tu sitio web, tendrás que copiar y pegar el fragmento de JavaScript en cada página de tu sitio web, justo antes de la etiqueta de cierre </head>.
Para instalar el fragmento de seguimiento de JavaScript en tu sitio web:
Ve a la página Formularios y haz clic en Configuración.
Desplázate hacia abajo hasta que veas el fragmento de JavaScript (o cópialo desde la página de configuración al crear un pop-up).
3.Copia y pega el fragmento de seguimiento universal en el HTML de tu sitio web justo antes de la etiqueta de cierre </head>. (Solo necesitas hacerlo una vez, incluso si planeas instalar varios formularios en tu sitio web).
Tu sitio web se compone de secciones de HTML llamadas elementos. El primer elemento es el <head>, comienza con la etiqueta de apertura <head> y termina con la etiqueta de cierre </head>. Si no sabes cómo editar el HTML de tu sitio web, te recomendamos que te pongas en contacto con el equipo de soporte de la plataforma en la que creaste tu sitio web.
Nota: ¿Usas WordPress o Shopify? Instala el plugin MailerLite para WordPress o el plugin MailerLite para Shopify para instalar tus formularios en tu sitio web sin utilizar ningún código.
Cómo ocultar/mostrar formularios pop-up en páginas específicas
Cuando creas un formulario emergente se mostrará en cada página de tu sitio web por defecto. Sin embargo, en tu configuración de visibilidad puedes decidir si deseas que ese formulario pop-up se muestre en cada página de tu sitio web, algunas páginas de tu sitio web; o puedes optar por ocultarlo en páginas específicas de tu sitio web.
Para ocultar tu formulario emergente en páginas específicas:
Selecciona Ocultar en páginas específicas.
Copia y pega la URL de la página web de las páginas en las que no quieres que aparezca tu ventana emergente. Pega cada URL en su propia línea.
Marca la casilla etiquetada Aplicar igualdad estricta para ocultar tu ventana emergente solo en páginas que coincidan exactamente con las URL ingresadas.
Para mostrar tu formulario emergente solo en páginas específicas:
Selecciona Solo mostrar en páginas específicas.
Copia y pega la URL de la página web de las páginas en las que quieres que aparezca tu ventana emergente. Pega cada URL en su propia línea.
Marca la casilla etiquetada Aplicar igualdad estricta para que tu ventana emergente se muestre solo en páginas que coincidan exactamente con las URL ingresadas.
Nota: Si no marcas la casilla Aplicar igualdad estricta, todas las URL que contengan la URL que has introducido se incluirán en la configuración de visibilidad.
Por ejemplo, si configuras tu formulario emergente para ocultarse en www.mailerlite.com y no marcas Aplicar igualdad estricta, tu ventana emergente se ocultará en todas las páginas web que contengan www.mailerlite.com, incluidas www.mailerlite.com/blog y www.mailerlite.com/about, etc.
Ventana pop-up al hacer clic
¿Quieres convertir tus textos, imágenes y botones en ventanas pop-up en las que se pueda hacer clic?
Para utilizar la función Ventana pop-up al hacer clic:
Ve a la pestaña Formularios.
Puedes utilizar la pestaña Pop-ups o la pestaña Formularios integrados.
Localiza un formulario que hayas creado y haz clic en Resumen.
Desplázate hacia abajo hasta la sección de Fragmentos de seguimiento de JavaScript. Aquí encontrarás los scripts que necesitas, que deberás insertar en cada página de tu sitio a la que desees añadir la ventana pop-up. Normalmente, el CMS tiene un lugar especial para implementar este código y mostrarlo en cada página.
Haz clic en Mostrar en el evento de clic. Aquí tendrás acceso a todos los códigos Javascript de eventos de clic. Si deseas que la ventana pop-up se muestre en un evento de clic, entonces el código Javascript debe ser añadido.
Para crear un botón pop-up, copia el código de la segunda tabla gris. Esto creará un botón en tu entrada. El código que hay debajo es para cuando quieras mostrar tu ventana pop-up siempre que se haga clic en un enlace. Puedes utilizar este código para mostrar tu formulario cuando alguien haga clic en un texto o en una imagen.
Para el botón, copia y pega el código y reemplaza la frase Haz clic aquí para mostrar la ventana pop-up con tu propio botón CTA. El estilo del botón es el mismo que has establecido en tu blog. Si deseas cambiar el botón, tienes que cambiar la configuración de diseño en tu blog.
Para el enlace haz clic en pop-up, copia y pega el código y reemplaza la frase Haz clic aquí para mostrar pop-up con el texto o el código de la imagen.
Haz clic en Publicar y visualiza tu nueva publicación emergente.
Nota: Si utilizas WordPress, a veces cuando cambias entre las pestañas del editor visual y de texto, la información pop-up del editor fuente se pierde. Simplemente actualiza la página y tu información estará de vuelta. Evita pulsar el botón Actualizar, pues entonces tendrás que volver a añadir la información.
Cómo usar el editor de formularios pop-up
El editor de formularios pop-up está dividido en dos secciones por dos pestañas que se encuentran en la barra lateral: la pestaña Bloques y la pestaña Diseño.
Pestaña Bloques
En la pestaña Bloques, puedes arrastrar y soltar bloques de contenido adicionales en tu formulario emergente.
Hay seis bloques para elegir:
Texto - Utiliza este bloque para agregar más texto a tu formulario emergente
Imagen - Utiliza este bloque para agregar una imagen o GIF a tu formulario emergente
Imagen y contenido - Utiliza este bloque para agregar una imagen, GIF o video a tu formulario emergente con texto adjunto al mismo
Cuenta atrás - Utiliza este bloque para crear urgencia añadiendo un temporizador de cuenta regresiva a tu formulario emergente
Enlaces sociales - Utiliza este bloque para agregar enlaces a tus páginas de redes sociales a tu formulario emergente
Divisor - Utiliza este bloque para dividir el contenido en tu formulario emergente añadiendo un divisor
Pestaña de Diseño
La pestaña Diseño te permite editar el diseño visual de tu formulario emergente. Dentro de la pestaña de diseño encontrarás cuatro secciones: Tipo de formulario, Configuración de diseño, Configuración de formulario de suscripción y Configuración adicional.
Tipo de formulario
Aquí es donde seleccionas cómo quieres que sea el cuadro emergente. Por ejemplo, es posible que desees que tu ventana pop-up aparezca como un cuadro en el centro de la página web, o que desees que la ventana emergente ocupe toda la pantalla.
Configuración de diseño
Aquí es donde decides el diseño general de tu formulario emergente. Cada elemento de diseño tiene una burbuja de diseño asociada en la que puedes hacer clic para modificar la configuración de diseño, como fuentes, formato y colores. Por ejemplo, si deseas cambiar la fuente de todos los textos del encabezado uno:
Ve a la pestaña Diseño.
Haz clic en Ajustes de diseño.
En Elementos de contenido, busca la burbuja de diseño etiquetada Encabezado 1 y haz clic en ella.
Aparecerá una ventana en la que podrás editar la fuente de todo el texto del epígrafe 1.
Configuración del formulario
Aquí puedes aplicar diferentes configuraciones a tu formulario. Estos ajustes incluyen:
Política de privacidad: añade una declaración de privacidad a tu formulario emergente.
Casilla de verificación de confirmación: agrega una casilla de verificación de consentimiento del usuario a tu formulario emergente.
Campo de segmentación oculto: añade un campo oculto para segmentar tu lista de suscriptores. Puedes seleccionar un campo y un valor para que todos los suscriptores de este formulario tengan ese valor agregado a ese campo.
Campos de permisos de marketing (compatibles con RGPD): incluya casillas de verificación de permisos de marketing compatibles con RGPD en tu formulario emergente.
Grupos de interés - Dar a los suscriptores la opción de elegir su propio grupo de suscriptores.
reCAPTCHA - Añade una casilla de verificación “No soy un robot” a tu formulario emergente. Esto ayuda a evitar que robots de spam potencialmente dañinos se unan a tu lista de suscriptores.
