Envía un formulario web a Gmail (y por qué falla mailto:)

Envía el formulario a un backend de formularios y añade tu dirección de Gmail como destinataria; no uses un action mailto:, que solo abre la app de correo del visitante. Después añade un filtro de Gmail para el remitente, para que los envíos se salten el spam y tengan su propia etiqueta. Al pulsar Reply en Gmail respondes al visitante, desde tu propia dirección.

Qué cambia aquí

Gmail es un buzón, no un servicio de envío para tu sitio. No tiene una URL a la que un formulario pueda enviar, así que cualquier camino hacia Gmail pasa por otra cosa. Lo primero que prueba casi todo el mundo es mailto::

<form action="mailto:you@gmail.com" method="post" enctype="text/plain">
  <input name="name" />
  <input name="email" type="email" />
  <textarea name="message"></textarea>
  <button>Send</button>
</form>

Funciona, en tu equipo. Pulsas Send, se abre tu app de correo con los campos en el cuerpo y te lo envías a ti mismo. La experiencia de un visitante es distinta:

Cuando un mensaje sí llega, el cuerpo son líneas name=value en bruto, porque eso es lo que produce la codificación text/plain:

name=Ada Lovelace
email=ada@example.com
message=Hi, do you take on small bathroom jobs in March?

Los otros caminos hacia Gmail funcionan, pero cada uno necesita un servidor que gestiones tú:

Apps Script merece un análisis más detallado, porque es el camino que sugieren la mayoría de los tutoriales. Escribes una función doPost, la despliegas como app web que cualquiera puede llamar y apuntas el formulario a su URL. Funciona, pero un envío de formulario normal deja al visitante en una página servida desde el dominio de Google en lugar del tuyo, cualquier bot que encuentre la URL puede agotar la cuota del día y el script se ejecuta como tú, así que un fallo en él puede enviar emails a cualquiera desde tu cuenta. Además, a partir de ahí cada cambio en los campos del formulario es cosa tuya.

Envía el formulario a Gmail

Este es un formulario para un pequeño negocio de oficios. El campo job hace que la bandeja sea fácil de revisar, y email tiene ese nombre para que las respuestas vayan al visitante:

<form action="https://ikiform.com/f/frm_xxxxxxxxxxxxxxxx" method="post">
  <label for="name">Your name</label>
  <input id="name" name="name" autocomplete="name" required />

  <label for="email">Email for our reply</label>
  <input id="email" name="email" type="email" autocomplete="email" required />

  <label for="job">What do you need?</label>
  <select id="job" name="job" required>
    <option value="">Choose one</option>
    <option value="repair">A repair</option>
    <option value="quote">A quote for a new job</option>
    <option value="other">Something else</option>
  </select>

  <label for="message">Details</label>
  <textarea id="message" name="message" rows="5" required></textarea>

  <input name="_gotcha" type="text" tabindex="-1" autocomplete="off" hidden />
  <button>Send to our inbox</button>
</form>

1. Crea un formulario en Ikiform y sustituye frm_xxxxxxxxxxxxxxxx por su id.
2. Si te registraste con tu dirección de Gmail, ya recibes los emails como propietario del espacio de trabajo. Si no, abre los ajustes de Notifications del formulario, escribe la dirección de Gmail en Add someone outside the workspace y pulsa Send link.
3. Abre el email de confirmación en Gmail y confirma. Hasta entonces, la dirección muestra Waiting for confirmation y no recibe nada.
4. Añade tu dominio en Allowed domains del formulario, publica la página y envía una prueba.

Mantenlo fuera del spam con un filtro de Gmail

El primer email de un remitente nuevo puede acabar en Spam o en Promotions. Un filtro sobre el remitente lo soluciona para siempre. En Gmail, abre las opciones de búsqueda, pon notifications@ikiform.com en From, pulsa Create filter y marca Never send it to Spam, Apply the label, Always mark it as important y Categorize as: Primary, lo que lo mantiene fuera de Promotions.

O importa el filtro. Este es el formato que genera la propia función Export de filtros de Gmail; Google no lo documenta aparte, así que si una importación falla, crea el filtro a mano como arriba. Guárdalo como mailFilters.xml y ve a Settings, See all settings, Filters and Blocked Addresses, Import filters:

<?xml version="1.0" encoding="UTF-8"?>
<feed xmlns="http://www.w3.org/2005/Atom" xmlns:apps="http://schemas.google.com/apps/2006">
  <title>Mail Filters</title>
  <entry>
    <category term="filter"></category>
    <title>Mail Filter</title>
    <content></content>
    <apps:property name="from" value="notifications@ikiform.com"/>
    <apps:property name="label" value="Website"/>
    <apps:property name="shouldNeverSpam" value="true"/>
    <apps:property name="shouldAlwaysMarkAsImportant" value="true"/>
    <apps:property name="smartLabelToApply" value="^smartlabel_personal"/>
  </entry>
</feed>

Crea primero la etiqueta Website, o cámbiale el nombre en el archivo. Un solo filtro cubre todos los formularios, porque todas las notificaciones llegan desde la misma dirección. Para separar formularios en etiquetas distintas, filtra por el asunto, como subject:("New submission: Quote request").

Responder desde Gmail

Gmail respeta la cabecera reply-to, así que Reply se dirige al visitante. Tu respuesta sale desde tu dirección de Gmail, sin rastro de Ikiform en el hilo.

• Para responder desde la dirección de tu negocio, añádela en Settings, Accounts and Import, Send mail as, y elígela en la línea From cuando respondas.
• Gmail puede agrupar en una sola conversación las notificaciones con el mismo asunto, porque el asunto es siempre New submission: y el nombre del formulario. Desactiva Conversation view en los ajustes de Gmail si prefieres ver una fila por mensaje.
• Los resúmenes por hora no tienen reply-to, porque cubren a muchos visitantes. Responde a esos desde los enlaces del panel.

Comprueba que funciona

1. Rellena el formulario en tu página y envíalo. Llegas a tu página de agradecimiento, o a la alojada de Ikiform.
2. Busca el email en Gmail. Tiene tu etiqueta y no está en Spam ni en Promotions.
3. Pulsa Reply. La línea To es la dirección escrita en el formulario.
4. Envía con el honeypot relleno, _gotcha=bot. Sigue recibiendo una respuesta de éxito, pero el envío se guarda como spam y no manda ningún email ni webhook.
5. ¿No llegó nada? Cambia el filtro de estado del panel a Spam. El spam recibe la misma respuesta de éxito que un envío real.

Detalles a tener en cuenta

• Alias de Google Workspace. Si el destinatario es un alias o un Grupo de Google, los ajustes del propio grupo deciden si se permiten remitentes externos. Envía una prueba antes de confiar en ello.
• La confirmación va a spam. El email con el enlace de confirmación también viene de Ikiform. Si no aparece, mira en Spam y márcalo como no spam.
• Varias direcciones de Gmail. Cada formulario envía emails a un máximo de 10 direcciones en total, y cada dirección externa se confirma por separado.
• Enlaces mailto: antiguos en otras partes. Un enlace mailto: en tu pie de página está bien como enlace. El problema es solo mailto: como action de un formulario.

Preguntas