> ## Documentation Index
> Fetch the complete documentation index at: https://buttercms.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Custom form modeling in dashboard

> Model custom forms with ButterCMS Collections and references so your app can render and submit them.

{/* /SOURCE */}

## When to use custom forms

Choose custom forms if you want to:

* Control the validations
* Apply custom frontend styling
* Choose where form submission data is sent
* Perform A/B testing on the positioning of form fields
* Avoid vendor contracts and subscriptions

***

## Custom forms vs form builders

### Advantages of custom forms

| Benefit                 | Description                                                                                                                  |
| ----------------------- | ---------------------------------------------------------------------------------------------------------------------------- |
| **Full Control**        | Control the design, functionality, and validation logic. Custom forms are tailored to fit your brand and specific needs.     |
| **Advanced Validation** | Custom forms allow for complex validation rules and error handling, giving you more flexibility than third-party tools.      |
| **Data Ownership**      | You decide where the data is stored, ensuring compliance with your internal policies and privacy regulations like GDPR.      |
| **No Vendor Lock-In**   | You aren't tied to third-party vendors or contracts, and you have full control over the form's availability and performance. |
| **Scalability**         | You can easily scale and modify your forms as your business grows, without being limited by external platforms.              |
| **Custom Integrations** | You can connect forms directly to your systems, CRMs, or APIs without paying for extra integrations.                         |

### Considerations

| Consideration        | Description                                                                                               |
| -------------------- | --------------------------------------------------------------------------------------------------------- |
| **Development Time** | Custom forms require developer resources, which can slow down the process of building and updating forms. |
| **Maintenance**      | You're responsible for maintaining, updating, and securing the forms.                                     |
| **Analytics**        | You need to implement your own tracking for submissions and user behavior.                                |
| **Security**         | You'll need to handle security features like CAPTCHA and ensure compliance with regulations.              |

***

## Building custom forms with Collections

You can use ButterCMS Collections to build custom forms. Using the **Reference** field in a Component, a user can position the form to render on a webpage with the rest of the Components and content they're using.

### Step 1: Create a form Collection

Create a Collection to define the overall form structure:

![Form collection schema](https://cdn.buttercms.com/gQmixUyiRQxhR0TxDRxg)

Recommended fields for the **Form** Collection:

| Field Name            | Field Type | Purpose                                   |
| --------------------- | ---------- | ----------------------------------------- |
| `form_name`           | Short Text | Internal identifier                       |
| `form_title`          | Short Text | Display title                             |
| `submit_button_text`  | Short Text | Button label (e.g., "Submit", "Send")     |
| `success_message`     | Long Text  | Message shown after successful submission |
| `submission_endpoint` | Short Text | API endpoint for form submissions         |
| `fields`              | Reference  | Links to Form Field Collection            |

### Step 2: Create a form field Collection

Create a **Form Field** Collection to define individual form fields:

![Form Field collection schema](https://cdn.buttercms.com/3DSjlBz4QxmuJqeuQVuG)

| Schema Field Name          | Schema Field Type | What it is used for                                  |
| -------------------------- | ----------------- | ---------------------------------------------------- |
| `field_label`              | Short Text        | The label for the input field                        |
| `field_name`               | Short Text        | Used in code accessibility and handling input data   |
| `input_type`               | Dropdown          | Changes the input type (email, password, text, etc.) |
| `required`                 | Checkbox          | Makes the field required for form submission         |
| `validation_error_message` | Short Text        | Customizes the error message                         |
| `allow_numbers`            | Checkbox          | Allows or disallows numbers                          |
| `allow_special_symbols`    | Checkbox          | Allows or disallows special characters               |
| `placeholder`              | Short Text        | Placeholder text for the input                       |
| `options`                  | Repeater          | For dropdowns/select fields, list of options         |

***
