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

# Autoresponder

Customize the content of your autoresponder email using Handlebars, a simple templating language that lets you insert dynamic data from the submitter's own submission directly into the email body.

<Note>
  This is available on the **Pro** plan and above.
</Note>

## Setting Up Your Email Template

Go to your form's Settings page, then navigate to the **Auto Responder** > **Email Template** section. You can edit your template using the built-in editor, which supports [Handlebars syntax](https://handlebarsjs.com/guide/).

## Available Context Variables

When rendering your autoresponder email template, PipedForm provides the following context:

| Variable | Type     | Description                                  |
| -------- | -------- | -------------------------------------------- |
| `fields` | `object` | The submitted form data, keyed by field name |

## Example Context

```typescript theme={null}
{
  fields: {
    Name: 'John',
    Email: 'john@gmail.com',
    Message: 'This is message from john.',
    Hobbies: ['Reading', 'Gaming', 'Traveling'],
    Company: {
      name: 'Acme Inc',
      role: 'Software Engineer',
    },
    Files: [
      { name: 'File.png', url: 'https://storage.pipedform.com/submission/019f40ed-65aa-754b-90dd-504b87836506.png' },
      { name: 'File2.png', url: 'https://storage.pipedform.com/submission/019f40ed-2046-7985-9628-8ff55ce6a67c.png' },
    ],
  },
}
```

## Custom Helpers

In addition to Handlebars' built-in helpers `{{#each}}`, `{{#if}}`, `{{#unless}}`, etc.), PipedForm provides the following custom helpers:

| Helper     | Description                                                                                                                            |    |
| :--------- | :------------------------------------------------------------------------------------------------------------------------------------- | :- |
| `json`     | Serializes a value to a JSON string. Accepts an optional `indent` argument (e.g. `{{json this indent=2}}`) to pretty-print the output. |    |
| `isArray`  | Returns `true` if the given value is an array. Useful inside `{{#if}}` to branch on field type.                                        |    |
| `isObject` | Returns `true` if the given value is an object. Useful inside `{{#if}}` to branch on field type.                                       |    |

## Rendering Submission Fields

Since field values can be strings, arrays, nested objects, or file attachments, PipedForm's pre-built template uses `isArray` and `isObject` to render each field appropriately:

```handlebars theme={null}
{{#each fields}}
  <div>
    <p>
      {{@key}}
    </p>
    <p>
      {{#if (isArray this)}}
        {{#each this}}
          {{#if url}}
            <a href='{{url}}'>
              {{#if name}}
                {{name}}
              {{else}}
                {{url}}
              {{/if}}
            </a>
          {{else}}
            <code>{{json this indent=2}}</code>
          {{/if}}
          {{#unless @last}}, {{/unless}}
        {{/each}}
      {{else if (isObject this)}}
        <code style='white-space: pre;'>
          {{~json this indent=2~}}
        </code>
      {{else}}
        {{this}}
      {{/if}}
    </p>
  </div>
{{/each}}
```

This template handles all field types dynamically:

* **Strings and numbers** - rendered directly (`{{this}}`).
* **Arrays** - each item is rendered individually. If an item has a `url` (like a file attachment), it's rendered as a link using `name` as the label (or the URL itself if `name` is missing). Otherwise, the item is rendered as formatted JSON.
* **Objects** (like `Company`) - rendered as pretty-printed JSON using the `json` helper.

## Full Example

```handlebars theme={null}
<h1>Thanks for your submission!</h1>
<p>Here's a copy of what you sent us:</p>

{{#each fields}}
  <div>
    <p>{{@key}}</p>
    <p>
      {{#if (isArray this)}}
        {{#each this}}
          {{#if url}}
            <a href='{{url}}'>{{#if name}}{{name}}{{else}}{{url}}{{/if}}</a>
          {{else}}
            <code>{{json this indent=2}}</code>
          {{/if}}
          {{#unless @last}}, {{/unless}}
        {{/each}}
      {{else if (isObject this)}}
        <code style='white-space: pre;'>{{~json this indent=2~}}</code>
      {{else}}
        {{this}}
      {{/if}}
    </p>
  </div>
{{/each}}
```

<Warning>
  **Notes:**

  * Field names in `fields` match the `name` attribute of your form's inputs exactly, including capitalization.
  * Field values can be strings, arrays, nested objects, or file attachment arrays `{name, url}[]`) - use `isArray` and `isObject` to handle each type appropriately.
</Warning>