# Connect your website's own form with Website Forms

> Point the contact or quote form your website already has at Crewtavo, like Formspree. Each message becomes a request and an email to your inbox.

Website Forms is built into Crewtavo and works like Formspree. You keep the form your website already has, in its own fonts and colors, and change one thing: where it sends. Each message then becomes a request in Crewtavo, and an email goes to the people you choose. Reply to that email and you're answering the customer.

It costs nothing extra, and the messages stay in your own Crewtavo.

:::tip[Website Forms or a booking form?]
Use **Website Forms** when your website already has a form, or you want one that looks like the rest of your site. Use a [booking form](https://crewtavo.com/docs/sales/booking-form-on-your-website/) when you want Crewtavo to build the form for you, with your services, photos and a service area check.
:::

## Install it

An owner, or an admin who can connect apps, does this once.

1. Open **Apps** (in the menu on a computer, or under **More** on a phone) and choose **Crewtavo - Website Forms**, under **Built into Crewtavo**.
2. Click **Install**.

A form called **Contact form** is ready right away. It has its own address, and it emails your business's email address from **Settings → Company** (or yours, if the business doesn't have one yet).

## Point your form at Crewtavo

On the app's page, under **Point your form at this address**, click **Copy**. In your website's form, set the `action` to that address and the `method` to POST:

```html
<form action="https://crm.yourbusiness.com/f/3fa9c2d71b" method="POST">
```

Then name the fields so Crewtavo knows what each one is:

| Field name | Where it goes |
| --- | --- |
| `name` (or `first_name` and `last_name`) | The client's name |
| `email` | The client's email, and where Reply goes |
| `phone` | The client's phone number |
| `address`, with `city`, `state` and `zip` if you ask them separately | The property |
| `company` | The client's business name |
| `message` | The request's details |

Crewtavo also understands the usual other spellings, like `full_name`, `E-mail Address`, `Phone Number`, `street_address`, `zip_code`, `comments` or `details`. Every other field your form asks, like the service they want or how they heard about you, comes along with the message under its own name.

Each message needs an email address or a phone number, so you can answer it.

### Need a form?

Open **Need a form? Copy one that's ready to paste** on the app's page and click **Copy the form**. It's a plain form with name, email, phone, address and message fields that takes your website's own fonts and colors:

```html
<form action="https://crm.yourbusiness.com/f/3fa9c2d71b" method="POST">
  <label>Name <input type="text" name="name" autocomplete="name" required></label>
  <label>Email <input type="email" name="email" autocomplete="email" required></label>
  <label>Phone <input type="tel" name="phone" autocomplete="tel"></label>
  <label>Address <input type="text" name="address" autocomplete="street-address"></label>
  <label>Message <textarea name="message" rows="5" required></textarea></label>
  <!-- Keeps bots out. Leave it here, hidden. -->
  <input type="text" name="_gotcha" style="display:none" tabindex="-1" autocomplete="off">
  <button type="submit">Send</button>
</form>
```

Paste it where the form should go, in your site builder's **HTML**, **Embed** or **Code** block. The steps for Squarespace, Wix, WordPress, GoDaddy and Google Sites are the same as for a [booking form](https://crewtavo.com/docs/sales/booking-form-on-your-website/).

:::note
Most site builders' own form blocks, like Wix Forms or Squarespace's Form block, send to the site builder and don't let you choose where. To send to Crewtavo, use your own form in an HTML block, like the one above.
:::

### Try it

Fill in your form on your website and send it. It shows up in **Requests** within seconds, and the app's page says **Taking messages** with the time of the last one. **See them in Requests** shows only the messages from your website forms.

## What happens to each message

- **It becomes a request.** In **Requests** it's marked **Website form**, and it's called by the form's name (or the form's `_subject`). The message is under **What they asked for**, with every other field listed below it.
- **It goes on the right client.** Crewtavo looks for a client with the same email address, and then the same phone number, however either was written. A message from someone you already have goes on their record, and their saved name, email and phone stay as they are: what they typed shows on the request instead. Anyone new becomes a lead, with **Website form** as their lead source.
- **The address becomes a property**, or the client's property with the same street address.
- **The people you chose get an email** called "New message from" and the person's name, listing everything they sent, with an **Open the request** button. Reply to it and you're answering whoever sent the message. This needs [email set up](https://crewtavo.com/docs/connections/email/) in Crewtavo.
- **The office is told** by the automation **Tell the office about new online requests**, the same as for booking forms.
- **The page that brought them in** shows on the request when [Website Analytics](https://crewtavo.com/docs/connections/website-analytics/) is installed.
- **They see a thank-you page** with your logo: "Thanks! Your message was sent." and "{Your business} will get back to you soon.", with a **Back to the website** button. You can send them to your own page instead (below).

## Each form's settings

Each form has its own card on the app's page.

- **Email each message to**: up to 5 email addresses, separated by commas. Leave it empty to only see messages in Requests.
- Under **More settings**:
  - **Form name**: what each request from it is called.
  - **After someone sends it**: **A thank-you page from Crewtavo**, or **My own page** with its address, like `https://greenlawn.com/thanks`.
  - **Only take messages from**: your website, like `greenlawn.com`. A copy of your form on any other website can't send to Crewtavo then. Leave it empty to take messages from any website.
  - **Get a new address**: the old address stops taking messages right away, so put the new one in your form's action straight after. Use it if bots have found your form.
  - **Delete form**: its address stops taking messages. The messages it already sent stay in Requests.

Click **Save changes** when you're done. **Add a form** makes another one, like a quote form next to your contact form. Each gets its own address, and its name on each request.

## Moving from Formspree

Change your form's action from its formspree.io address to your Crewtavo form's address. Everything else stays as it is. Formspree's own fields work the same:

- `_gotcha`: the hidden field that keeps bots out. People leave it empty; when a bot fills it in, it's told the message went through and nothing is kept.
- `_subject`: the email's subject, and the request's name.
- `_next`: the page to go to after sending, instead of the thank-you page.
- `_replyto`: the email address to answer, when the form has no `email` field.

Other fields that start with `_` are ignored. Files aren't taken: if you need photos, use a [booking form](https://crewtavo.com/docs/sales/booking-form-on-your-website/) with a photos question. For job applications with résumés, use [Careers](https://crewtavo.com/docs/connections/careers/), which works the same way and puts each one in **Applicants**.

## Send with JavaScript

A form that sends with `fetch()` works too, from any website. Ask for JSON and you get JSON back instead of the thank-you page:

```js
const response = await fetch("https://crm.yourbusiness.com/f/3fa9c2d71b", {
  method: "POST",
  headers: { Accept: "application/json" },
  body: new FormData(form),
});
const result = await response.json();
// Sent: { ok: true, next: "…" }
// Not sent: { ok: false, error: "Add an email or phone number so we can reach you." }
```

You can also send JSON, with `Content-Type: application/json`.

## Keep spam out

- Keep the hidden `_gotcha` field in your form. The ready-made form has it.
- One address can send 10 messages an hour, and your business takes 100 an hour from all its forms. After that people see "Too many messages. Try again later, or call us."
- Fill in **Only take messages from** with your website.
- If spam still gets through, use **Get a new address**.

## Uninstall

On the app's page, click **Uninstall**. Your forms stop taking messages right away, and people who fill one in are told it wasn't sent. Every form keeps its address and its messages stay in Requests, so installing it again picks up where you left off.

## If something goes wrong

When a message isn't sent, the person sees a page that says why, with a **Go back to the form** button, so nothing they typed is lost.

- **"Add an email or phone number so we can reach you."** The form sent neither. Check that your email field is named `email` and your phone field `phone`.
- **"That email address doesn't look right. Check it and try again."** The email wasn't a whole address, and there was no phone number.
- **"This form only takes messages from its own website."** The page the form is on isn't in **Only take messages from**. Add it, or leave the setting empty.
- **"This form isn't taking messages right now. Call or email the business instead."** Website Forms is uninstalled, the form was deleted, or it got a new address. Check the address in your form's action against the app's page.
- **"The form didn't send anything Crewtavo can read. Its method should be POST."** Add `method="POST"` to your form.
- **"Too many messages. Try again later, or call us."** See [Keep spam out](#keep-spam-out).
- **"That's too much to send in one message."** or **"Part of the message is too long. Shorten it and try again."** A message can have up to 60 fields, 5,000 characters in each.
- **No email arrives.** If the app's page says "Email isn't set up in Crewtavo yet, so messages only show in Requests.", [connect your email](https://crewtavo.com/docs/connections/email/). Otherwise see [email not arriving](https://crewtavo.com/docs/troubleshooting/email-not-arriving/). The messages are in Requests either way.

Source: https://crewtavo.com/docs/connections/website-forms/ (last updated 2026-10-28)