Hugo form to email

Hugo generates static pages, so it has nothing to receive a form. FormDoc does that part: the form posts to FormDoc and each submission is emailed to you.

Option 1: a shortcode (use it inside Markdown)

Save this as layouts/shortcodes/formdoc.html and replace the key with yours from app.formdoc.dev/new:

<form action="https://api.formdoc.dev/v1/submit" method="POST">
  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY">

  <label for="fd-name">Name</label>
  <input type="text" id="fd-name" name="name" autocomplete="name" required>

  <label for="fd-email">Email</label>
  <input type="email" id="fd-email" name="email" autocomplete="email" required>

  <label for="fd-message">Message</label>
  <textarea id="fd-message" name="message" rows="5" required></textarea>

  <input type="checkbox" name="botcheck" style="display:none" tabindex="-1" autocomplete="off">
  <button type="submit">Send</button>
</form>

Then add it to any Markdown page:

{{< formdoc >}}

Option 2: a partial (use it in a template)

Save the same form as layouts/partials/formdoc.html and include it in a template, for example your contact page layout:

{{ partial "formdoc.html" . }}

Pasting raw HTML into Markdown instead?

Recent Hugo versions don’t render raw HTML in Markdown unless you allow it in your site config:

[markup.goldmark.renderer]
  unsafe = true

A shortcode or partial avoids that setting, which is why we suggest them.

Next