Cómo enviar un correo HTML después de un formulario con Make, Tally y Gmail

Recibes una solicitud a través de un formulario y quieres confirmar su recepción con un mensaje claro, el logotipo de la empresa y un siguiente paso útil. En Make, esa confirmación puede utilizar un correo HTML diseñado visualmente en Mailvex, sin escribir toda la estructura dentro de la automatización.

En esta guía, Tally recibe la respuesta, Make organiza los datos y Gmail envía el mensaje. Comenzaremos con un destinatario fijo: tu propia dirección. Después de revisar el resultado, el destinatario será el correo indicado en el formulario. El único dato personalizado dentro del mensaje será el nombre.

1. Prepara las cuentas y un formulario de prueba

Necesitas acceso a Tally, Make, una cuenta Gmail que pueda autorizar la conexión y Mailvex con el correo de tu cuenta confirmado. Revisa las condiciones de tu plan para exportar HTML, las cuotas de Make y los límites de envío de Google. Este flujo utiliza la conexión Gmail de Make; no requiere configurar SMTP.

• Crea un formulario en Tally con Name como campo obligatorio. Utiliza un campo de texto corto para el nombre.
• Añade Email como campo obligatorio de tipo correo electrónico, para recibir una dirección con un formato adecuado.
• Si lo necesitas, agrega Question como campo opcional. La pregunta quedará fuera del cuerpo de la confirmación de este ejemplo.
• Publica el formulario y ten disponible su enlace. Prepara un nombre de prueba y una dirección que te pertenezca.

Los nombres Name y Email facilitan seguir el ejemplo, pero no sustituyen la identificación de los campos en Make. Al recibir la primera respuesta, revisarás los datos reales en Fields by ID. El campo de correo ayuda a validar el formato; no demuestra que quien completó el formulario sea dueño de esa dirección.

2. Captura una respuesta utilizando solo el módulo Tally

Crea un escenario vacío en Make. Agrega Tally y selecciona Watch New Responses. Por ahora, deja únicamente este módulo en el escenario: la primera ejecución permite conocer los datos recibidos antes de añadir cualquier envío.

Mantén Immediately as data arrives desactivado hasta completar las pruebas manuales. Si el escenario ya estaba activo y vas a cambiar la plantilla, desactiva primero el interruptor y guarda. Envía cada respuesta nueva después de Run once y no ejecutes otra copia al mismo tiempo.

• En el módulo, selecciona Create a webhook y escribe en Webhook name un nombre que permita reconocer ese formulario.
• En Connection, elige una conexión existente o utiliza Add. Cuando se solicite, selecciona Tally OAuth y completa la autorización de la cuenta.
• En Form ID, selecciona el formulario de prueba. Guarda el webhook y el módulo; guarda también el escenario.
• Haz clic en Run once. Mientras el módulo espera, abre el formulario publicado y envía una respuesta nueva con tus propios datos.

Abre la burbuja de resultados del módulo y localiza Fields by ID. Identifica qué entrada contiene el nombre enviado y cuál contiene la dirección de correo. Esos serán los tokens que seleccionarás desde el panel de mapeo en los siguientes pasos. No copies una ruta de otro tutorial ni adivines el identificador de un campo.

Watch New Responses utiliza un webhook: para esta captura debes generar una respuesta nueva después de iniciar Run once. Si no llega nada, comprueba el formulario seleccionado y la conexión. No continúes hasta reconocer tus dos valores en el resultado de Tally.

3. Diseña una confirmación sencilla en Mailvex

En Mailvex, elige una plantilla con Usar plantilla, o Usar esta plantilla en su página de detalles. Prefiere una estructura breve: logotipo, saludo, confirmación de recepción, siguiente paso y pie de página. El objetivo es orientar a quien acaba de completar el formulario, sin añadir ofertas ni promesas ajenas a su solicitud.

Puedes tomar este contenido como referencia: saludo “¡Hola, NAME_SLOT!”, título “Recibimos tu solicitud” y texto “Gracias por ponerte en contacto. Recibimos tu solicitud. Si necesitas agregar información, utiliza nuestro canal de atención.” Incluye un botón hacia una página real de contacto, si resulta útil. No inventes un plazo de respuesta.

Coloca NAME_SLOT una sola vez, dentro de un bloque de texto normal. En Make sustituirás este marcador por el nombre tratado para HTML. No lo pongas en la dirección de un botón, en atributos de imagen ni en código de script. Deja Question fuera del mensaje: una confirmación no necesita repetir todo el texto recibido.

• Ajusta colores, logotipo, firma e idioma de los elementos de servicio y del pie de página.
• Define un preheader coherente, por ejemplo: “Nuestro equipo recibió tu solicitud.”
• Sustituye enlaces de ejemplo y destinos # por páginas reales. Revisa también los enlaces del pie.
• Elimina condiciones y variables de plantilla que este flujo no completa, como {{first_name}} o {{unsubscribe_url}}. Conserva los enlaces de servicio necesarios con destinos reales.

La vista previa puede mostrar valores de demostración para algunas variables. Eso no significa que el HTML exportado contenga esos valores. El ejemplo debe quedar estático, con la única excepción del marcador NAME_SLOT. El asunto del mensaje se configurará por separado en el módulo Gmail de Make.

Selecciona cada bloque condicional, abre “Condición de visibilidad (ESP)” en el panel derecho y desactiva “Mostrar según condición”. Cambiar solo la visibilidad en la vista previa no elimina la condición del código exportado.

4. Copia el HTML y mantén las imágenes accesibles

Abre Exportar HTML. En Formato de variables (ESP), utiliza el perfil mailvex y selecciona Copiar HTML. Este perfil no convierte las variables en tokens de Make ni busca datos de Tally. Revisa el código copiado: debe conservar NAME_SLOT, pero no variables o condiciones que nadie vaya a procesar.

Copiar y descargar HTML cuentan como acciones de exportación según tu plan. Basta con un método: si necesitas un archivo, guarda el código ya copiado como texto en un archivo .html.

Para la primera prueba, mantén las imágenes en modo Mailvex, con las direcciones alojadas que aparecen en el código. Una imagen debe ser accesible públicamente para cargar fuera del editor. El modo Propio cambia la base de las URLs, pero requiere alojar los archivos en ese destino; seleccionarlo no transfiere las imágenes.

No utilices rutas de tu computadora ni enlaces que exijan iniciar sesión. Evita eliminar imágenes que sigan apareciendo en mensajes ya exportados. Los cambios posteriores en el diseño también requieren copiar de nuevo el HTML al escenario: la copia pegada en Make no se actualiza al editar el proyecto en Mailvex.

5. Configura Gmail: Send an email

Agrega Gmail después de Tally y elige Send an email. Crea o selecciona la conexión y autoriza la cuenta Google que solicita Make. Si tu organización restringe aplicaciones externas, la autorización puede depender de las reglas del administrador. Ninguna contraseña debe incluirse dentro del HTML.

En Connection, utiliza Create a connection y después Sign in with Google para autorizar la cuenta que enviará el mensaje.

Deja CC recipients y BCC recipients vacíos. Para la primera prueba, utiliza la cuenta conectada como remitente y no agregues otros destinatarios. Deja Signature content vacío si el diseño ya incluye una firma.

El campo del cuerpo puede aparecer como Content o Body contents según la interfaz. Lo esencial es utilizar Raw HTML y pegar el código, no una imagen del mensaje ni el texto copiado desde la vista previa visual. Mantén el asunto estático mientras compruebas el flujo básico.

6. Sustituye NAME_SLOT por el nombre con escapeHTML

En el campo del cuerpo, busca NAME_SLOT dentro del saludo. Borra únicamente el marcador y deja el cursor en ese punto, sin modificar el resto del HTML. En el panel de mapeo, abre Text and binary functions y selecciona escapeHTML. Dentro del argumento de la función, elige el token del nombre en Fields by ID de Tally, desde la primera pestaña del panel.

La función escapeHTML(text) escapa el marcado HTML del nombre antes de insertarlo en el texto del saludo. Por ejemplo, un fragmento como <b>María</b> debe mostrarse como texto, sin dar formato al correo. Selecciona el token real desde el panel; no escribas manualmente una expresión con identificadores supuestos.

Aplica la función solamente al nombre, nunca al documento completo, porque el código terminaría mostrándose como texto. Este procedimiento sirve para un valor dentro de texto visible; no es una instrucción para insertar respuestas en URLs, atributos o scripts. Guarda el módulo después de revisar el mapeo y el destinatario fijo.

7. Realiza un envío controlado y revisa el mensaje

Con Tally y Gmail conectados, vuelve a seleccionar Run once. Envía una respuesta nueva en el formulario usando tu nombre de prueba y tu propia dirección. Ahora la ejecución puede enviar un mensaje real: revisa el destinatario fijo antes de comenzar y no utilices respuestas de clientes para esta prueba.

• En Make, revisa la ejecución de Tally y los datos que llegaron al módulo Gmail, especialmente destinatario, asunto y nombre.
• Abre el mensaje en tu propio correo. Comprueba saludo, acentos, texto, preheader, enlaces y pie de página.
• Mira el mensaje en computadora y celular. Evalúa el ancho, el tamaño del texto, el botón y la carga de imágenes.
• Si haces ajustes, actualiza el HTML en Make, vuelve a aplicar el mapeo del nombre si corresponde y genera una respuesta nueva de prueba.

La vista previa del editor no reproduce todos los comportamientos de los clientes de correo. Una ejecución completada tampoco garantiza la ubicación del mensaje en la bandeja de entrada. Si no aparece, revisa la cuenta remitente, la ejecución y la carpeta de spam, sin disparar repetidamente el escenario sin comprobar la causa.

8. Mapea el destinatario antes de activar el escenario

Después de validar el diseño, vuelve a Gmail. En Recipient email address 1, sustituye tu dirección fija por el token correspondiente a Email en Fields by ID. Ese campo recibe una dirección, no HTML: no apliques escapeHTML al destinatario. Confirma que seleccionaste Email y no Name o Question.

Haz otra ejecución controlada con Run once y una respuesta nueva que incluya tu propio correo. Revisa el destinatario resuelto en el módulo y el mensaje recibido. Solo entonces activa la programación inmediata, Immediately as data arrives, y guarda con Save para procesar automáticamente las respuestas nuevas.

Antes de activar, comprueba si hay eventos de prueba pendientes en la cola. Reejecutar una operación o procesar respuestas pendientes puede producir nuevos envíos. Para uso continuo, controla duplicados mediante un identificador único de respuesta, cuando esté disponible: registra lo procesado y verifica ese registro antes de enviar. No utilices únicamente el nombre como identificador.

Problemas frecuentes y qué revisar

Preguntas frecuentes

¿Necesito una integración nativa entre Mailvex y Make?

No para este proceso. Diseñas el correo en Mailvex y transfieres el HTML con Copiar HTML. Tally y Gmail son los módulos conectados al escenario. Gmail se encarga del transporte del mensaje; Mailvex prepara el contenido.

¿Puedo incluir la pregunta enviada desde el formulario?

Puedes ampliar el flujo, pero este ejemplo deja Question fuera de la confirmación. Si agregas otros valores, revisa la finalidad y el contexto de cada inserción. escapeHTML protege la inserción como texto HTML; no valida direcciones, no autoriza destinatarios ni resuelve cualquier tipo de contenido.

¿Sirve este escenario para una campaña con muchos contactos?

El escenario muestra una confirmación individual después de una respuesta. Las campañas requieren evaluar consentimiento, baja, gestión de contactos y límites del servicio de envío. No conviertas una automatización de atención en un envío a una lista sin preparar esos requisitos.

¿Cómo reutilizo el trabajo en otro formulario?

Duplica el diseño si necesitas otro mensaje y actualiza el HTML en el escenario correspondiente. En Make, revisa el nuevo Form ID y captura una respuesta para mapear los campos reales. Reutilizar el diseño no elimina la necesidad de revisar destinatario, tokens y prueba de envío.