Add a contact form to an Astro site

Short answer: Astro builds static pages by default, so there's no server to receive a form. Point the form's action at a Sendform endpoint and submissions arrive by email. No API route, adapter or SSR needed, and the form works without hydration.

1. Get an endpoint

Sign up free at sendform.app, create a form and copy the endpoint: https://sendform.app/api/public/f/YOUR_ID.

2. Create src/pages/contact.astro

---
const endpoint = "https://sendform.app/api/public/f/YOUR_ID";
---
<html lang="en">
  <head><title>Contact</title></head>
  <body>
    <h1>Contact</h1>
    <form action={endpoint} method="POST">
      <label>Name <input name="name" type="text" required></label>
      <label>Email <input name="email" type="email" required></label>
      <label>Message <textarea name="message" required></textarea></label>
      <input type="text" name="_gotcha" style="display:none" tabindex="-1" autocomplete="off">
      <input type="hidden" name="_redirect" value="https://yoursite.com/thanks">
      <button type="submit">Send</button>
    </form>
  </body>
</html>

Use name="email" for the visitor's address: the notification's reply-to uses it.

3. Thank-you page

Create src/pages/thanks.astro. The _redirect URL must be absolute and on the site the form is posted from, one of your form's allowed domains, or your saved redirect's domain. You can also set the redirect once in the dashboard.

4. Spam

Sendform filters spam with rate limits and optional Cloudflare Turnstile. The hidden _gotcha honeypot field in the snippet adds bot protection. Spam never counts toward your quota.

Optional: stay on the page

Add a <script> that posts with fetch() and Accept: application/json, then shows your own message. (Same snippet as on the static forms page.)

Troubleshooting

  • Nothing arrives: check the endpoint ID, method="POST" and your spam folder. Test from the deployed site.
  • Redirect ignored: the _redirect URL must be absolute and on the site the form is posted from, one of your allowed domains, or your saved redirect's domain.
  • Error after submitting: wrong ID, or the form was deleted.

Plans

Free: $0, 250 submissions a month, 3 forms. Pro: $5/mo or $48/yr for 5,000, with autoresponder, file uploads, webhooks and API. Spam never counts.