Est-ce que cela fonctionne avec le pipeline de build Eleventy par défaut ?

Oui. Le formulaire est du markup brut qui survit aux transformations de template d'Eleventy. Pas de fichiers de données, plugins ou shortcodes requis.

Puis-je utiliser ceci depuis un template JSX ou Liquid ?

Oui. Le HTML ne change pas entre les langages de template - seule la façon d'intégrer les parties dynamiques comme l'URL de redirection change selon la syntaxe du template.

Comment gérer le spam sans ajouter une intégration au moment du build ?

La protection anti-spam est du côté de Formhook : le champ honeypot élimine les bots silencieusement, et Cloudflare Turnstile est un commutateur par formulaire. Vous n'avez rien à câbler dans le build Eleventy.

← Tous les guides

Guide

Formulaire de contact Eleventy (sans backend)

Eleventy rend en HTML statique au moment du build, donc un formulaire de contact Eleventy est juste un formulaire HTML brut dans un template Nunjucks (ou Liquid, ou HTML brut). Le form action pointe vers Formhook, et il n'y a rien d'autre à faire.

Le snippet

contact.Eleventy

{# src/contact.njk - Nunjucks template, plain HTML form #}
<form action="https://formhook.app/f/YOUR_API_KEY" method="POST">
  <input type="email" name="email" placeholder="Email" required />
  <textarea name="message" placeholder="Message" required></textarea>
  <input type="text" name="_gotcha" tabindex="-1" autocomplete="off" hidden />
  <input type="hidden" name="_redirect" value="{{ '/thanks' | url }}" />
  <button type="submit">Send</button>
</form>

Comment ça marche

Le snippet fonctionne dans n'importe quel langage de template Eleventy - Nunjucks (montré), Liquid, Handlebars, HTML brut, JSX. Le filtre {{ '/thanks' | url }} applique la transformation d'URL d'Eleventy pour que _redirect fonctionne correctement avec un pathPrefix. Déposez le formulaire dans un template de page ou un include - peu importe lequel.

Ce qui se passe ensuite

La soumission arrive dans votre tableau de bord Formhook en moins d'une seconde.
Une notification push se déclenche sur chaque appareil où vous l'avez activée.
Répondez directement depuis le tableau de bord (Pro et au-dessus) - garde votre vraie boîte de réception hors du HTML du formulaire.

Lancez votre formulaire de contact Eleventy aujourd'hui.

Inscrivez-vous gratuitement, créez un formulaire, collez la clé API. Cinq minutes.

Commencer gratuitement

Niveau gratuit : 5 formulaires · 250 soumissions/mois · Sans carte bancaire.

Formulaire de contact Eleventy - FAQ

Est-ce que cela fonctionne avec le pipeline de build Eleventy par défaut ?: Oui. Le formulaire est du markup brut qui survit aux transformations de template d'Eleventy. Pas de fichiers de données, plugins ou shortcodes requis.
Puis-je utiliser ceci depuis un template JSX ou Liquid ?: Oui. Le HTML ne change pas entre les langages de template - seule la façon d'intégrer les parties dynamiques comme l'URL de redirection change selon la syntaxe du template.
Comment gérer le spam sans ajouter une intégration au moment du build ?: La protection anti-spam est du côté de Formhook : le champ honeypot élimine les bots silencieusement, et Cloudflare Turnstile est un commutateur par formulaire. Vous n'avez rien à câbler dans le build Eleventy.

Guides pour les autres frameworks

Migrating from Formspree? See how Formhook compares.