Platforms / Astro
Contact form for Astro — no backend required
Astro ships static HTML by default. Form actions that expect a local server fail on pure static hosts unless something else receives the POST.
Setup
- Create a FormHeron form.
- Drop an HTML form into any .astro page.
- Include the honeypot field.
- Deploy static; FormHeron receives the POST.
Working example
---
// no server logic required
---
<form action="https://formheron.com/f/YOUR_KEY" method="POST">
<label>
Email
<input type="email" name="email" required />
</label>
<label>
Message
<textarea name="message" required></textarea>
</label>
<!-- honeypot: off-screen, not type=hidden -->
<input type="text" name="_hp" tabindex="-1" autocomplete="off"
aria-hidden="true" style="position:absolute;left:-9999px" />
<button type="submit">Send</button>
</form>Common problems
Astro islands and hydration
A plain form needs no client JS. Only hydrate if you add client-side validation.
Multi-domain previews
Add Netlify/Vercel preview origins to the allowlist or leave it open during testing.
mailto: fallbacks
Avoid mailto: for production — spam filters and mobile clients treat it poorly. Use FormHeron instead.
FAQ
How do I add a contact form to Astro?
Use a standard HTML form with action https://formheron.com/f/YOUR_KEY. No Astro API route required.
Does it work on Cloudflare Pages?
Yes. Static HTML posts to FormHeron over HTTPS.
Can I use React components in Astro?
Yes — same form markup inside a React island.