Guide d’installation

Premiers pas

À l’inscription, votre premier formulaire est créé pour vous. Copiez l’URL affichée dans votre tableau de bord et placez-la dans l’action de votre formulaire. Utilisez POST pour l’attribut method.

<form action="https://formchan.app/f/YOUR_FORM_KEY" method="POST">
  <input name="name">
  <input name="email" type="email">
  <textarea name="message"></textarea>
  <button>Envoyer</button>
</form>

Après l’envoi, la personne voit une page de confirmation. Le message arrive dans votre boîte de réception, et l’IA ajoute des ★ et des tags.

Noms des champs

Nommez vos champs comme vous voulez. Chaque champ envoyé apparaît tel quel dans la boîte de réception et dans les e-mails de notification.

L’adresse e-mail utilisée pour répondre est lue dans un champ nommé email. Les champs mail et _replyto fonctionnent aussi. Le nom de l’expéditeur est lu dans name ou fullname.

Un envoi peut faire jusqu’à 64 KB, avec 50 champs au maximum et 5 000 caractères par champ.

Après l’envoi

Par défaut, Formchan affiche sa propre page de confirmation, avec un lien vers la page précédente.

Pour rediriger vers votre propre page, placez son URL dans un champ masqué nommé _next.

<input type="hidden" name="_next" value="https://example.com/thanks">

Envoyer depuis JavaScript

Envoyez avec l’en-tête Accept: application/json, et Formchan répond en JSON au lieu d’afficher une page. Le visiteur reste sur votre page.

const res = await fetch('https://formchan.app/f/YOUR_FORM_KEY', {
  method: 'POST',
  headers: { Accept: 'application/json' },
  body: new FormData(form),
});
const data = await res.json(); // { ok: true }

En cas de succès, vous recevez ok: true. En cas d’échec, vous recevez ok: false et l’un de ces codes d’erreur.

Protection anti-spam

Ajoutez à votre formulaire un champ masqué nommé _gotcha. Les gens ne le voient pas, mais les robots le remplissent. Ces envois sont acceptés en apparence, puis supprimés.

<input name="_gotcha" style="display:none" tabindex="-1" autocomplete="off">

Les messages envoyés de nombreuses fois depuis le même endroit en peu de temps sont refusés.

Dans les paramètres du formulaire, vous pouvez lister les sites autorisés à y envoyer des messages. Les envois depuis d’autres sites sont refusés.

WordPress, Webflow et autres

HTML

Utilisez tel quel le code de formulaire ci-dessus.

WordPress

Collez le code du formulaire dans un bloc HTML personnalisé.

Webflow

Dans les paramètres du formulaire, placez l’URL dans Action et réglez Method sur POST.

React / Next.js

Envoyez avec fetch, comme dans « Envoyer depuis JavaScript ».

Notifications

Les messages ★3 sont envoyés par e-mail à vos adresses de notification dès leur arrivée. Quand vous ajoutez une adresse, nous lui envoyons un e-mail de confirmation ; les notifications commencent une fois le lien qu’il contient cliqué.

Les ★1 et ★2 sont regroupés dans un seul e-mail par jour. Vous pouvez changer l’heure, et aucun e-mail n’est envoyé les jours sans nouveauté.

À partir de l’offre Pro, vous pouvez aussi envoyer les messages sur Slack, Chatwork, Microsoft Teams, Google Chat et Discord.

Webhooks

Avec l’offre Business, Formchan envoie un POST en JSON vers votre URL une fois chaque message reçu et lu par l’IA.

L’en-tête X-Formchan-Signature contient un HMAC-SHA256 du corps de la requête, signé avec votre secret de webhook, sous la forme sha256=…. Calculez la même valeur de votre côté pour vérifier que la requête vient bien de Formchan.

Exemple de corps

{
  "event": "submission.created",
  "at": "2026-10-12T09:29:41.000Z",
  "workspace": { "id": "w_…", "name": "Harbor Design Studio" },
  "submission": {
    "id": "sb_…",
    "number": 1,
    "form": { "id": "fm_…", "name": "Contact" },
    "received_at": "2026-10-12T09:29:38.000Z",
    "name": "Emily Parker",
    "email": "emily@example.com",
    "fields": { "name": "Emily Parker", "email": "emily@example.com", "message": "…" },
    "stars": 3,
    "tags": [{ "id": "tg_…", "name": "Inquiry", "by": "ai" }],
    "summary": "Wants a consultation on adding a second floor.",
    "reason": "Concrete request with budget and timeline.",
    "done": false
  }
}

Vérifier la signature (Node.js)

import crypto from 'node:crypto';

// rawBody: the request body as a string, before JSON.parse
function isFromFormchan(rawBody, signature, secret) {
  const expected = 'sha256=' + crypto.createHmac('sha256', secret).update(rawBody).digest('hex');
  const a = Buffer.from(expected), b = Buffer.from(signature || '');
  return a.length === b.length && crypto.timingSafeEqual(a, b);
}