Formulaire de contact Hugo (sans backend)

Le snippet

{{/* layouts/contact.html - plain HTML inside Hugo's template syntax */}}
<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" | absURL }}" />
  <button type="submit">Send</button>
</form>

Comment ça marche

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) - utile quand la mission client signifie plusieurs sites Hugo pointant vers un seul compte Formhook.

Formulaire de contact Hugo - FAQ

Est-ce que cela fonctionne avec le build `hugo` statique et `hugo deploy` ?

Oui. Le formulaire est du HTML brut dans la sortie compilée. Hugo ne tourne pas côté serveur, donc le formulaire POSTe directement vers Formhook depuis le navigateur.

Puis-je utiliser les fonctionnalités i18n de Hugo avec le formulaire de contact ?

Oui - le formulaire lui-même est du markup, donc les libellés localisés fonctionnent comme dans n'importe quel autre template Hugo. Utilisez les fonctions i18n de Hugo sur les placeholders et les libellés de champs.

Comment éviter de coder en dur la clé API dans chaque template ?

Mettez la clé dans les params de votre site (config.toml ou hugo.yaml) et référencez-la comme {{ .Site.Params.formhookKey }} dans le template. Traitez-la comme un identifiant d'endpoint public - les rate limits par formulaire de Formhook et le commutateur Turnstile assurent la vraie protection.