Agregar un formulario de suscripción emergente a tu sitio web

Los formularios de suscripción emergentes te ayudan a conectar con la gente que visita tu sitio Web. Usa nuestro Constructor de formularios para diseñar y personalizar rápidamente un formulario emergente con una oferta o descuento especial para conseguir más audiencia y aumentar tus ventas. Te proporcionaremos el código que necesitas para incrustarlo en tu sitio.

En este artículo, aprenderás cómo diseñar y editar un formulario emergente en MailChimp y agregarlo a tu sitio.

Antes de empezar

A continuación, se detallan algunos puntos que debes saber antes de empezar este proceso.

  • Esta es una tarea avanzada, recomendada solo para usuarios familiarizados con la codificación personalizada. Ponte en contacto con tu programador o contrata un  experto de MailChimp si necesitas ayuda.
  • Si necesitas traducir tu contenido a otro idioma, prueba el  formulario incrustado.
  • Si usas MailChimp para Shopify, MailChimp para PrestaShop o MailChimp para WooCommerce, puedes agregar automáticamente un formulario emergente a tu tienda desde la página  Connected Sites (Sitios conectados).

Acceder al Constructor de formularios emergentes

En el Constructor de formularios es el lugar en el que personalizas tu formulario de suscripción emergente y generas el código que necesitas para incrustar tu formulario en tu sitio.

Para acceder al Constructor de formularios, sigue estos pasos:

  1. Ve a la página  Lists (Listas).
  2. Haz clic en el menú desplegable junto a la lista con la que quieres trabajar y elige  Signup forms  (Formularios de suscripción).
    Cursor clicks list drop-down menu and chooses signup forms.
  3. Selecciona  Subscriber pop-up  (Elemento emergente de suscriptor).
    Cursor clikcs the select button.

A continuación, personalizarás el aspecto de tu formulario emergente y agregarás el código del formulario a tu sitio.

Personalizar el formulario

En el Constructor de formularios, navegarás entre tres pestañas para crear tu formulario: Design  (Diseño), Fields  (Campos) y  Content  (Contenido). Aquí es donde elegirás el formato de tu formulario emergente y el momento en que se mostrará a la gente que visite tu sitio. También podrás agregar y diseñar etiquetas, botones de llamada a la acción y mensajes personalizados.

El formulario emergente es de opt-in único por defecto para que puedas aumentar tu lista rápidamente.  Si lo prefieres, puedes configurar tu formulario para que sea de  opt-in doble en cualquier momento.

Para personalizar tu formulario emergente, sigue estos pasos:

  1. En la pestaña  Design (Diseño), elige un formato para tu formulario.
    • Haz clic en Modal para mostrar el formulario en el centro de tu sitio.
    • Haz clic en Slide (Deslizar) para que tu formulario se deslice y se muestre en una posición fija en la parte inferior derecha de tu pantalla.
    • Haz clic en Fixed (Fijo) para mostrar el formulario en una posición fija en la parte inferior de tu sitio. Este formato sólo muestra el campo de dirección de correo electrónico y el cuerpo del texto de tu formulario. Elige otro formato para mostrar campos adicionales, texto del pie de página o una imagen.
  2. Haz clic en el menú desplegable  Display (Presentación) para elegir el momento en el que tu formulario le aparecerá a la gente que visite tu sitio.
  3. A continuación, elige  Image alignment (alineación de imagen) y los estilos para las etiquetas de campo, botones y el elemento emergente.
  4. En la pestaña  Fields  (Campos), marca la casilla junto a cada campo que desees incluir en tu formulario.
    Cursor clicks checkbox next to field label.
  5. Para convertir un campo en obligatorio, desliza en control deslizante  Required (Obligatorio) a la marca de verificación verde.
  6. Para reorganizar un campo, haz clic en el icono  con tres puntos junto a él y arrástralo hasta donde quieres que aparezca en tu formulario.
    Cursor clicks and drags three dots icon to reorder a field.
  7. En la pestaña  Content (Contenido), agrega la imagen y texto que quieres incluir en tu formulario emergente.
    Cursor clicks browse to open the content manager.

Después de personalizar tu formulario emergente, alterna entre las pestañas  Desktop (Escritorio) y  Mobile (Móvil) para ver el aspecto que tu formulario tendrá en diferentes dispositivos.

 

Banner de vista preliminar

Si alguien mira tu sitio en un dispositivo móvil, aparecerá un banner en lugar de tu formulario emergente.  Los espectadores pueden tocar el banner para ver el formulario completo. En el Constructor de formularios, puedes realizar una vista preliminar del banner para ver cómo se verá en un teléfono o tableta.

Para realizar la vista preliminar de un banner móvil, sigue estos pasos:

  1. En el  Pop-Up Form Builder (Constructor de formulario emergentes), haz clic en la pestaña  Mobile (Móvil).
  2. Desliza el control deslizante a la marca de verificación verde para realizar la vista preliminar de tu banner.

Otras cosas que debes saber

  • Los campos obligatorios en tu lista no se marcan automáticamente como obligatorios en el formulario de suscripción emergente. Marca los campos como obligatorios en la pestaña  Fields (Campos).
  • Los campos Group (Grupo) pueden ser obligatorios en el formulario de suscripción emergente. Esta no es una opción en nuestros formularios de suscripción alojados o incrustados.
  • Establece la  Overlay Opacity (Opacidad de superposición) de 1 a 100, en el que los valores más bajos son más transparentes y los más altos mucho más sólidos. Usar sólo números—la opción no funcionará si usas texto u otros caracteres, como %. Si dejas el campo Overlay Opacity (Opacidad de superposición) en blanco, seleccionaremos por defecto algo que funcione en la mayoría de sitios.
  • Asegúrate de personlizar las  páginas y correos electrónicos de respuesta relacionados con tu formulario.
  • Para ayudar a evitar las  suscripciones falsas, puedes activar el opt-in doble para agregar la confirmación reCAPTCHA a tu formulario emergente. O, usa nuestro formulario general alojado que incluye reCAPTCHA independientemente del método de opt-in.
  • El código de tu sitio Web puede afectar el aspecto de tu formulario emergente. A veces, puedes necesitar CSS adicional para diseñar tu formulario.
  • La opción de presentación  On exit (Al salir) muestra tu formulario cuando los visitantes del sitio alejan el cursor de la pestaña o ventana actual. Esta opción de presentación está disponible cuando se visualiza tu sitio en un escritorio, pero no está disponible para dispositivos móviles.

Generar código del formulario

Para terminar, generarás el código del formulario para agregarlo a tu sitio Web. El mejor lugar para añadir el código varía de un sitio a otro. Ponte en contacto con un desarrollador si no estás seguro de cómo modificar el HTML de tu sitio. 

Para generar el código del formulario, sigue estos pasos:

  1. En el  Pop-Up Form Builder (Constructor de formularios emergentes), haz clic en  Generate Code  (Generar código).
  2. En el elemento emergente  Copy/paste onto your site (Copiar/pegar en tu sitio), resalta el código y cópialo en tu portapapeles.
  3. Pega el código en el HTML de tu sitio Web.

¡Buen trabajo!  Tu formulario emergente aparecerá cuando alguien visite tu sitio. Si eligen completar y enviar tu formulario, los agregaremos a tu lista de MailChimp.

Si un visitante ha visto con anterioridad tu formulario,  usaremos cookies para asegurarnos de que no lo vuelvan a ver durante un año (o hasta que borren sus cookies).

Editar el formulario

Después de añadir el código del formulario emergente de suscripción a tu sitio, puede que necesites cambiar el formulario.

Para editar el formulario, sigue estos pasos:

  1. Ve al  Pop-Up Form Builder (Constructor de formularios emergentes).
  2. Haz clic en cualquier pestaña para realizar cambios.
  3. Haz clic en Publish (Publicar).
    After you make changes to your popup form, click Publish.
  4. En el elemento emergente  Publish Form  (Publicar formulario), haz clic en  Publish  (Publicar).

¡Ya está! Insertaremos automáticamente los cambios en el código en tu sitio y actualizaremos tu formulario emergente.

Siguientes pasos

Para identificar a la gente que se sucribió con el formulario de suscripción, segmenta tu lista por  Signup Source (Fuente de suscripción). Después de crear tu segmento, puedes enviar a estos suscriptores correos electrónicos con descuentos, recomendaciones de productos personalizadas y más.

Introducción a los segmentos

Todas las opciones de segmentación: fuente de suscripción

Empleo de los bloques de contenido de las Recomendaciones de productos 

Usar bloques de contenido de códigos promocionales

Eliminar el formulario

Para eliminar tu formulario emergente, tendrás que eliminar manualmente el código del formulario en tu sitio. Este proceso varía de un sitio a otro. Contacta a tu programador o contrata a un experto de MailChimp si necesitas ayuda. 

Si agregaste el formulario emergente a un sitio conectado, accede a él a través de la  página connected sites (sitios conectados) y haz clic en  Remove (Eliminar) para eliminar automáticamente el formulario de tu sitio.

¿Te fue útil este artículo?
¿Hay algo más que podemos hacer para mejorar nuestro sitio?

Servicio técnico