Hugo Contact Form Without a Backend

Set up FormsReach with Hugo

Create a free API key

Add a form partial

Create a partial with a standard form, method POST, action set to the FormsReach submit endpoint, and a hidden api_key field. Include the partial on your contact page.

Build and test

Run hugo and deploy the public site. Submit once - check email and/or WhatsApp depending on your delivery settings.

<form action="https://api.formsreach.com/submit" method="POST"> <input type="hidden" name="api_key" value="YOUR_API_KEY"> <input type="text" name="name" required> <input type="email" name="email" required> <textarea name="message" required></textarea> <button type="submit">Submit Form</button> </form>

<form action="https://api.formsreach.com/submit" method="POST"> <input type="hidden" name="api_key" value="YOUR_API_KEY" /> <input type="text" name="name" required /> <input type="email" name="email" required /> <textarea name="message" required></textarea> <button type="submit">Submit Form</button> </form>

Static generators still need form delivery

Hugo is built for speed and plain HTML. Contact forms still need a backend. FormsReach gives you a form API endpoint so a classic form in a partial works on any static host.

Platform notes

Prefer layouts/partials/contact-form.html for reuse.
Works with any Hugo theme that can include a partial.
After submit, you get email and/or WhatsApp based on how you configure delivery.

Troubleshooting

Nothing arrives: Confirm the partial renders api_key correctly after build.
Theme overrides: Ensure your contact template actually includes the partial.
Wrong fields: Ensure each input has a name attribute.

What you get

Free

500 credits every month for form submissions, email, and WhatsApp. Spam filtering, webhooks, and workflow rules included. No credit card required.

Starter & Pro

Larger monthly credit pools (2,000 or 8,000) for growing sites and multi-site volume. Same channels - email, WhatsApp via the official Meta API, webhooks. See pricing.

FAQ

Does Hugo need a runtime to handle forms?+

No. Hugo generates static HTML. FormsReach is the form backend the browser posts to.

Where should I store the API key?+

In the form as a hidden api_key field (as in the snippet). Treat it like a public form endpoint key, not a privileged server secret.

Free vs Pro delivery?+

Email and WhatsApp via Meta WhatsApp Business API, with spam filtering. Usage is metered in monthly credits.

Can I use shortcodes?+

Yes - wrap the form markup in a shortcode or partial and reuse it across pages.

Hugo contact form without a backend