Añadir un formulario de suscripción pop-up a tu sitio web 

Los formularios de suscripción pop-up te ayudan a conectar con la gente que visita tu sitio web. Utiliza el editor de formulario pop-up para diseñar rápidamente un formulario pop-up y personalízalo con una oferta especial o descuento para hacer crecer tu audiencia y aumentar tus ventas. Te proporcionaremos el código que necesitas para incrustarlo en tu sitio.

En este artículo aprenderás a diseñar y editar un formulario pop-up en Mailchimp y añadirlo a tu sitio.

Antes de empezar

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

  • Incrustar el código en un sitio web es una tarea avanzada que se recomienda solo a los usuarios que estén familiarizados con la codificación personalizada. Si necesitas ayuda, ponte en contacto con tu desarrollador o contrata a un experto de Mailchimp.
  • El código de tu sitio web puede afectar al aspecto del formulario emergente. A veces, es posible que haga falta retocar el CSS para cambiar el estilo del formulario.
  • Si te hace falta traducir el contenido a otro idioma, lee Cómo traducir un formulario de suscripción.
  • Si conectas un sitio web a Mailchimp de forma manual o si utilizas una integración con e-commerce compatible, podrás añadir automáticamente un formulario emergente a tu sitio o tienda desde la página Connected Sites (Sitios conectados).
  • No te olvides de personalizar las páginas relacionadas y los correos electrónicos de respuesta del formulario.
  • Utilizamos cookies para reducir el número de veces que les aparece el formulario emergente a quienes visitan un sitio web. Después de que un visitante vea el formulario la primera vez, no se le volverá a mostrar durante un año, a no ser que borre las cookies o abra el sitio web desde otro navegador.

Acceder al editor de formularios pop-up

El editor de formularios pop-up es donde podrás personalizar tu formulario de suscripción pop-up y generar el código que usarás para incrustar el formulario en tu sitio.

Sigue estos pasos para acceder al editor.

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

A continuación, personalizarás el aspecto de tu formulario pop-up y añadirás el código del formulario a tu sitio.

Personalizar el formulario

En el editor, 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 pop-up y el momento en que se mostrará a la gente que visite tu sitio. También podrás añadir y diseñar etiquetas, botones de llamada a la acción y mensajes personalizados.

Para ayudarte a la hora de hacer crecer tu lista, el formulario pop-up es de adhesión individual por defecto. Si lo prefieres, puedes configurar tu formulario para que sea de adhesión doble en cualquier momento.

Sigue estos pasos para personalizar tu formulario pop-up.

  1. En la pestaña Design (Diseño), selecciona un formato para tu formulario.

    • Haz click en Modal para mostrar el formulario en el centro de tu sitio.
    • Haz click en Slide (Deslizar) para que tu formulario se deslice y se muestre en una posición fija en la parte inferior derecha de tu sitio.
    • Haz click 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. Selecciona otro formato para mostrar campos adicionales, texto del pie de página o una imagen.
  2. Haz click en el menú desplegable Display (Mostrar) para seleccionar el momento en el que tu formulario le aparecerá a la gente que visite tu sitio.

  3. A continuación, elige la Image alignment (Alineación de imagen) y los estilos para las etiquetas de campo, botones y elemento pop-up.
  4. En la pestaña Fields (Campos), marca la casilla que aparece 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 Required (Obligatorio) a la marca de verificación verde.
  6. Para reorganizar un campo, haz click en el icono con tres puntos que aparece junto a él y arrástralo hasta donde quieras que aparezca en tu formulario.
    Cursor clicks and drags three dots icon to reorder a field.
  7. En la pestaña Content (Contenido), añade la imagen y texto que quieres incluir en tu formulario pop-up.
    Cursor clicks browse to open the content manager.

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

Mostrar banner móvil

Si alguien mira tu sitio en un dispositivo móvil, aparecerá un banner en lugar de tu formulario pop-up. Los visitantes podrán tocar el banner para ver el formulario completo. En el editor, puedes ver el banner en vista preliminar para ver qué aspecto tendrá en un teléfono o tablet.

Sigue estos pasos para realizar la vista preliminar de un banner móvil.

  1. En el editor de formulario pop-up, haz click en la pestaña Mobile (Móvil).
  2. Haz click en Show mobile banner (Mostrar banner móvil).

Cómo publicar un formulario

Si has conectado tu sitio web desde nuestra página Connected Sites (Sitios conectados) y has terminado de personalizar tu formulario, haz clic en la ventana modal emergente Publish (Publicar) y nosotros nos encargaremos de insertar el código automáticamente en tu sitio web.

Si, por el contrario, no has conectado tu sitio web desde nuestra página Connected Sites (Sitios conectados), tienes que generar el código del formulario e insertarlo manualmente en tu sitio web.

Generar código de formulario

The best place to add the code varies from site to site, so reach out to a developer if you're not sure where to modify your site's HTML.

To generate your form code and add it to your site manually, follow these steps.

  1. Navigate to the pop-up form editor.
  2. Click Generate Code.
  3. En el modal emergente Copy/paste onto your site (Copiar/pegar en tu sitio web), resalta el código y cópialo en el portapapeles.
  4. Pega el código en el HTML de tu sitio web.

Nice work! Your pop-up form will display when someone visits your site. If they choose to fill out and submit your form, we'll add them to your Mailchimp audience as a subscribed contact.

Si un visitante ha visto con anterioridad tu formulario, usaremos las cookies para asegurarnos de que no le vuelva a aparecer en un periodo máximo de un año, a no ser que borre las cookies o abra el sitio web desde otro navegador.

Editar el formulario

Después de añadir el código del formulario pop-up de suscripción a tu sitio, puede que necesites modificar el formulario.

Sigue estos pasos para editar el formulario.

  1. Ve al editor de formularios pop-up.
  2. Haz click en cualquier pestaña para realizar cambios.
  3. Haz click en Publish (Publicar).
    After you make changes to your popup form, click Publish.
  4. En el elemento pop-up Publish Form (Publicar formulario), haz click en Publish (Publicar).

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

Cómo añadir un formulario a varios sitios

To add the pop-up form code multiple sites, follow these steps.

  1. Navigate to the pop-up form editor.
  2. Click Want to add this pop-up form to another site? You will only see this code if you already have a site connected.
    lista-editor-formularios-emergentes-añadir-formulario-a-otro-sitio
  3. En el modal emergente Copy/paste onto your site (Copiar/pegar en tu sitio web), resalta el código y cópialo en el portapapeles.
    listas-formulario-emergente-modal-copiar-pegar
  4. Pega el código en el HTML de tu sitio web justo antes de la etiqueta de cierre < / head >.

¡Bien hecho! ¡Eso es todo! A partir de ahora aparecerá el formulario emergente en tu sitio conectado y en cualquier otro sitio con el código incrustado. Cualquier cambio que hagas en el formulario se aplicará al resto de sitios donde lo hayas incrustado.

Siguientes pasos

Para identificar a la gente que se ha suscrito con el formulario de suscripción, segmenta tu lista por 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

Usar bloques de contenido de recomendación de producto

Usar bloques de contenido de códigos promocionales

Eliminar el formulario

Si has añadido el formulario pop-up a un sitio conectado, accede a él a través de la página Sitios conectados y haz click en Remove (Eliminar) para eliminar automáticamente el formulario de tu sitio.

Para eliminar tu formulario pop-up, 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 desarrollador o contrata a un experto de Mailchimp si necesitas ayuda.


¿Te fue útil este artículo?

¿Hay algo más que podemos hacer para mejorar nuestro sitio?