Envoyer un formulaire de site vers Gmail (et pourquoi mailto : échoue)

Envoyez le formulaire vers un backend de formulaires et ajoutez votre adresse Gmail comme destinataire ; n'utilisez pas d'action mailto:, qui ne fait qu'ouvrir l'appli de messagerie du visiteur. Ajoutez ensuite un filtre Gmail sur l'expéditeur pour que les soumissions évitent les spams et aient leur propre libellé. Cliquer sur Répondre dans Gmail écrit au visiteur, depuis votre propre adresse.

Ce qui change ici

Gmail est une boîte de réception, pas un service d'envoi pour votre site. Il n'a pas d'URL vers laquelle un formulaire peut envoyer : tout chemin vers Gmail passe donc par autre chose. La première chose que la plupart des gens essaient, c'est 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>

Il fonctionne, sur votre machine. Vous cliquez sur Send, votre appli de messagerie s'ouvre avec les champs dans le corps, et vous vous l'envoyez. Pour un visiteur, c'est différent :

Quand un message passe, le corps est fait de lignes brutes name=value, car c'est ce que produit l'encodage text/plain :

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

Les autres chemins vers Gmail fonctionnent, mais chacun demande un serveur que vous gérez :

Apps Script mérite qu'on s'y attarde, car c'est le chemin que proposent la plupart des tutoriels. Vous écrivez une fonction doPost, la déployez en application web que tout le monde peut appeler, et faites pointer le formulaire vers son URL. Cela fonctionne, mais un envoi de formulaire classique laisse le visiteur sur une page servie depuis le domaine de Google plutôt que le vôtre, chaque bot qui trouve l'URL peut épuiser le quota du jour, et le script s'exécute en votre nom : un bug peut donc envoyer des e-mails à n'importe qui depuis votre compte. Vous êtes aussi responsable de chaque modification des champs du formulaire par la suite.

Envoyer le formulaire vers Gmail

Voici un formulaire pour un petit artisan. Le champ job rend la boîte facile à parcourir, et email est nommé ainsi pour que les réponses aillent au visiteur :

<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. Créez un formulaire dans Ikiform et remplacez frm_xxxxxxxxxxxxxxxx par son id.
2. Si vous vous êtes inscrit avec votre adresse Gmail, vous recevez déjà les e-mails en tant que propriétaire de l'espace de travail. Sinon, ouvrez les réglages Notifications du formulaire, saisissez l'adresse Gmail sous Add someone outside the workspace et cliquez sur Send link.
3. Ouvrez l'e-mail de confirmation dans Gmail et confirmez. D'ici là, l'adresse affiche Waiting for confirmation et ne reçoit rien.
4. Ajoutez votre domaine dans les Allowed domains du formulaire, publiez la page et envoyez un test.

Éviter les spams avec un filtre Gmail

Le premier e-mail d'un nouvel expéditeur peut atterrir dans Spam ou Promotions. Un filtre sur l'expéditeur règle cela définitivement. Dans Gmail, ouvrez les options de recherche, mettez notifications@ikiform.com dans De, cliquez sur Créer un filtre, puis cochez Ne jamais envoyer dans le dossier Spam, Appliquer le libellé, Toujours marquer comme important et Catégoriser comme : Principale, ce qui le garde hors de Promotions.

Ou importez le filtre. C'est le format qu'écrit la fonction Exporter des filtres de Gmail ; Google ne le documente pas à part, donc si l'import échoue, créez le filtre à la main comme ci-dessus. Enregistrez-le sous mailFilters.xml, puis allez dans Paramètres, Voir tous les paramètres, Filtres et adresses bloquées, Importer des filtres :

<?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>

Créez d'abord le libellé Website, ou renommez-le dans le fichier. Un seul filtre couvre tous les formulaires, car toutes les notifications viennent de la même adresse. Pour répartir les formulaires dans des libellés différents, filtrez plutôt sur l'objet, par exemple subject:("New submission: Quote request").

Répondre depuis Gmail

Gmail respecte l'en-tête reply-to, donc Répondre s'adresse au visiteur. Votre réponse part de votre adresse Gmail, sans qu'Ikiform n'apparaisse dans le fil.

• Pour répondre plutôt depuis votre adresse professionnelle, ajoutez-la dans Paramètres, Comptes et importation, Envoyer des e-mails en tant que, et choisissez-la sur la ligne De quand vous répondez.
• Gmail peut regrouper en une seule conversation les notifications qui ont le même objet, car l'objet est toujours New submission: suivi du nom du formulaire. Désactivez le Mode Conversation dans les paramètres de Gmail si vous préférez une ligne par message.
• Les récapitulatifs horaires n'ont pas d'adresse de réponse, puisqu'ils couvrent de nombreux visiteurs. Répondez à ceux-là via les liens du tableau de bord.

Vérifiez que tout fonctionne

1. Remplissez le formulaire sur votre page et envoyez-le. Vous arrivez sur votre page de remerciement, ou sur celle hébergée par Ikiform.
2. Retrouvez l'e-mail dans Gmail. Il porte votre libellé et n'est ni dans Spam ni dans Promotions.
3. Cliquez sur Répondre. La ligne À contient l'adresse saisie dans le formulaire.
4. Envoyez avec le honeypot rempli, _gotcha=bot. L'envoi reçoit quand même une réponse de succès, mais la soumission est stockée comme spam et n'envoie ni e-mail ni webhook.
5. Rien n'est arrivé ? Passez le filtre de statut du tableau de bord sur Spam. Le spam reçoit la même réponse de succès qu'une vraie soumission.

Pièges

• Alias Google Workspace. Si le destinataire est un alias ou un groupe Google, les paramètres du groupe décident si les expéditeurs extérieurs sont acceptés. Envoyez un test avant de compter dessus.
• La confirmation part en spam. L'e-mail contenant le lien de confirmation vient aussi d'Ikiform. S'il n'apparaît pas, regardez dans Spam et signalez-le comme non-spam.
• Plusieurs adresses Gmail. Chaque formulaire envoie des e-mails à 10 adresses au total, et chaque adresse extérieure confirme séparément.
• Anciens liens mailto : ailleurs. Un lien mailto: dans votre pied de page convient très bien comme lien. Le problème n'est que mailto: comme action d'un formulaire.

Questions