Contact form for Hugo
Hugo generates static pages, so there is no server to accept a submitted form. FormPost takes care of that part – your form sends its input to us, and we forward it to you by email.
Before you start: create a form in FormPost
Sign up for FormPost, create a form and enter the domain your site runs on. We then show you your form's address. It replaces https://www.formpost.eu/f/abc123 in the code below – nothing else needs to change.
1. Create the shortcode
The form goes into a shortcode. That way you can use it from any Markdown page without writing HTML into your content.
<form action="https://www.formpost.eu/f/abc123" method="POST">
<label for="email">Email</label>
<input type="email" id="email" name="email" required>
<label for="message">Message</label>
<textarea id="message" name="message" required></textarea>
<input type="text" name="_gotcha" style="display:none;" tabindex="-1" autocomplete="off">
<button type="submit">Send</button>
</form>
2. Put the shortcode on a page
Place the shortcode where the form should appear on your contact page. If you would rather use the form in a template, save the same file under layouts/partials/ and include it with {{ partial "contact-form.html" . }}.
{{< contact-form >}}
Good to know
- By default Hugo does not render HTML written directly in Markdown. The shortcode avoids that without changing the markup.goldmark.renderer.unsafe setting.
- We only accept submissions from the domain you entered. Submissions from the local development server (hugo server on localhost) are rejected; to try things out, use the test form in your dashboard.
- The form ships without its own CSS and takes on your theme's styling. Add classes and further fields in the shortcode as you like.
What FormPost cannot do today
- Forms are submitted the classic way, meaning the page changes. Sending in the background via JavaScript is not supported at present.
- We do not accept file attachments.
- FormPost does not collect consent from your visitors. The notice in your own privacy policy remains your job – the wording for it is waiting, ready to copy, next to your form.
More guides and comparisons
Create a form and try it
The Free plan covers one form with ten notifications a day and costs nothing, permanently.