Where should a Hugo form endpoint live?

Use site params or an environment-specific config file, then render the endpoint inside a reusable partial.

Does Hugo need a form plugin or serverless function?

No. Form Plume handles email notifications, stored submissions, spam filtering, file uploads, integrations, and webhooks after the static form posts.

Can Hugo contact forms upload files?

Yes. Add enctype="multipart/form-data" to the generated form and use a named file input like attachment.

What should I test after building Hugo?

Inspect the generated public HTML to confirm the endpoint, method, field names, hidden fields, and enctype were rendered correctly.

Does Form Plume work with Hugo?

Yes. Form Plume gives you one endpoint that works from your Hugo site. Start with the quickstart docs, then drop the endpoint into your form.

Where do Hugo form submissions go in Form Plume?

Submissions are stored in your Form Plume dashboard, sent to your email, and can trigger integrations like webhooks, Slack, Discord, Google Sheets, Mailchimp, and ActiveCampaign. See the feature overview for the full flow.

Can I try Form Plume before wiring it into my Hugo site?

Yes. You can create an endpoint on the free plan, test it from localhost, preview, or a staging URL, and upgrade only when your form volume or team needs grow. Compare limits on pricing or ask a question on the contact page.

New:Build with AI agents

Hugo contact forms
without serverless glue.

Keep your Hugo site static and point the generated form at Form Plume for email notifications, dashboard storage, spam filtering, file uploads, integrations, and signed webhooks.

Free foreverNo credit cardHugo endpoint ready in under a minute

layouts/partials/contact-form.html

<form action="{{ site.Params.formplumeEndpoint }}" method="POST">
  <input type="hidden" name="source" value="hugo">
  <input name="name" autocomplete="name" required>
  <input name="email" type="email" autocomplete="email" required>
  <textarea name="message" required></textarea>
  <button type="submit">Send</button>
</form>

The full guide

A hosted backend for Hugo partials.

Use Hugo params and partials to generate a plain form that works from any static host.

1
Create your Form Plume accountStart free and give your Hugo form a hosted endpoint for email, submissions, spam filtering, uploads, integrations, and webhooks.Start free
2
Create the form and copy the endpointCopy the endpoint URL from Form Plume. It looks like https://api.formplume.com/f/your-slug
3
Connect it inside HugoPut the endpoint in Hugo params, render it in a contact form partial, build the site, and inspect the generated HTML before deploying. Send one test submission from the real Hugo app or preview environment and confirm it reaches Form Plume.

You can use this AI prompt to hand the platform-specific wiring to an assistant without accidentally creating a backend.

You are helping me integrate a Hugo contact form with Form Plume.

Important:
- Do not create a Form Plume account or form for me.
- If I have not provided a Form Plume endpoint yet, stop and ask me for it.
- Tell me to get the endpoint by signing up at https://formplume.com/signup, creating a form, copying the endpoint URL, and pasting it back into this chat.
- Only update code after I provide the endpoint or explicitly confirm the placeholder should stay.

FORM_PLUME_ENDPOINT="PASTE_YOUR_FORM_PLUME_ENDPOINT_HERE"

After the endpoint is available:
- Set the form action or submission target to FORM_PLUME_ENDPOINT.
- Use method="POST" for a plain HTML form.
- Do not add a custom backend, database table, SMTP client, PHP mail handler, serverless function, or email provider.
- Preserve the existing visual styling unless I ask you to improve it.
- Make sure every input, textarea, and select that should be submitted has a name attribute.
- Use clear field names such as name, email, message, company, phone, subject, budget, page, source, and attachment.
- If the form includes files, use enctype="multipart/form-data".
- If I want a custom success page, add a hidden _redirect field with the URL or path I provide.
- Follow this implementation guidance: use a Hugo partial, site.Params or environment-specific config, generated HTML verification, named fields, and no serverless function.
- Preserve the existing component, template, or page styling unless I ask you to improve it.
- Keep labels, validation, pending states, success states, and error states accessible.
- Use FormData when the form includes files or may add files later.

After implementation, tell me exactly which file or editor area changed, where the endpoint is configured, and how to test one real submission.

Hugo forms belong in partials

Hugo generates static HTML, so the contact form only needs a real action, method="POST", and named fields. Put the markup in a partial such as layouts/partials/contact-form.html so every page uses the same endpoint and field names.

<form action="{{ site.Params.formplumeEndpoint }}" method="POST">
  <input type="hidden" name="source" value="hugo">
  <input type="hidden" name="_redirect" value="/thanks/">
 
  <label for="contact-name">Name</label>
  <input id="contact-name" name="name" autocomplete="name" required>
 
  <label for="contact-email">Email</label>
  <input id="contact-email" type="email" name="email" autocomplete="email" required>
 
  <label for="contact-message">Message</label>
  <textarea id="contact-message" name="message" rows="5" required></textarea>
 
  <button type="submit">Send message</button>
</form>

Then render the partial from a page template.

{{ partial "contact-form.html" . }}

Store the endpoint in params

Keep the endpoint out of repeated templates. Put it in hugo.toml, config/_default/params.toml, or an environment-specific config file.

[params]
formplumeEndpoint = "PASTE_YOUR_FORM_PLUME_ENDPOINT_HERE"

After hugo builds the site, inspect public/contact/index.html and confirm the real endpoint replaced the placeholder.

Uploads

Hugo does not need a plugin for file uploads. The generated HTML just needs multipart encoding and a named file input.

<form
  action="{{ site.Params.formplumeEndpoint }}"
  method="POST"
  enctype="multipart/form-data"
>
  <input type="file" name="attachment" accept=".pdf,.png,.jpg">
  <button type="submit">Send file</button>
</form>

Form Plume stores attachments separately from email delivery so large files do not break notifications.

Deploy anywhere

This works on Cloudflare Pages, Netlify, Vercel, GitHub Pages, S3, or any host that serves Hugo output. The host does not need native form handling because the browser posts to Form Plume.

Test the deployed URL, not only a local preview. Redirect paths, custom domains, and spam signals are easiest to verify on the final public page.

Primary sources

FAQ

Hugo form questions
before deploy.

Yes. Hugo outputs HTML, and the browser can post that form directly to Form Plume from any static host.

One line. Zero backend.

The form backend you don’t have to build.

Free foreverNo credit cardSet up in under a minute

Hugo contact forms without serverless glue.