# Add a contact form to an Astro site

> Handle Astro form submissions with SiteBackend. Works with fully static Astro builds - no server adapter or API route needed.

Source: https://sitebackend.com/docs/forms/astro · Updated: 2026-10-03

Astro sites are often fully static, so there's no server to receive a form. Point the form at SiteBackend instead. It works with `output: "static"`, and no adapter is needed.

```astro title="src/components/ContactForm.astro"
---
const endpoint = "https://api.sitebackend.com/forms/YOUR_FORM_ID";
---

<form action={endpoint} method="POST">
  <input type="email" name="email" placeholder="you@example.com" required />
  <textarea name="message" required></textarea>
  <input type="text" name="_gotcha" tabindex="-1" autocomplete="off" style="display:none" />
  <button type="submit">Send</button>
</form>
```

Use it on any page:

```astro title="src/pages/contact.astro"
---
import ContactForm from "../components/ContactForm.astro";
---

<ContactForm />
```

## Keep the endpoint out of your code

Put the endpoint in an environment variable. Astro exposes variables that start with `PUBLIC_` to your pages:

```bash title=".env"
PUBLIC_SITEBACKEND_FORM=https://api.sitebackend.com/forms/YOUR_FORM_ID
```

```astro
<form action={import.meta.env.PUBLIC_SITEBACKEND_FORM} method="POST">
```

## Local development

If you use allowed origins, add `http://localhost:4321`, Astro's default dev address.

## Show testimonials too

SiteBackend can also collect testimonials from your customers and show them on your site. See add testimonials to an Astro site.