Available on: Business plans
If you have the need for your emails to match a certain brand or want to control the copy on emails, you can accomplish this with custom email templates.
Creating the template
Custom templates are attached to a project and can be used for any forms inside the project. If you have a form that is not inside a project, you cannot use custom templates. On your project's settings page, click the Templates tab. Select +New Template, give your template a name and choose the appropriate template type. Templates can either be designed for submission notifications or autoresponses.
Editing the template code
An inline code editor allows you to fully design your email template. The email’s layout and copy can be edited in the HTML tab, while styling should be done using the CSS tab.
Most email browsers don’t support <script> tags and will ignore them. Do not include any <style> tags in the HTML tab, instead use the CSS tab. If you’ve sent HTML emails before, you may have had to inline the CSS. Formspree handles this for you based on your included HTML and CSS, so you don’t need to inline your CSS.
Formspree uses mustache templates, so we recognize certain special variables, depending on the template type.
Submission notification variables
{{ _time }} |
The date and time of the submission |
{{ _host }} |
The URL of the form (without "https://") |
{{ <fieldname> }} |
Any named input value in your form |
{{# _fields }} |
Starts a list of all fields. |
{{ _name }} |
Within _fields, the current field name… |
{{ _value }} |
… and field value. |
{{/ _fields }} |
Closes the _fields block |
{{ _unsubscribe }} |
The unsubscribe link |
To mitigate spam, the template MUST include the {{_unsubscribe}}
Autoresponse variables
{{ _time }} |
The date and time of the submission |
{{ submission_message }} |
Message defined in plugin settings. |
For spam purposes, you are currently unable to include submission fields in the autoresponse message.
Handling File Uploads
Since Formspree allows your users to send multiple file uploads on a single input, file upload fields are sent as a list of file upload URLs, in the format: ['URL
1', 'URL 2', ...]
.
If you want to split the URLs, you can do so by using the list iteration syntax for that particular form field. For instance, if you have a file input field named image_upload
, you add the following to your template to display all images in the email body:
{{# image_upload }}
<tr><td><a href="{{ . }}"><img src="{{ . }}" />{{ . }}</a></td></tr>
{{/ image_upload }}
Setting the from name and subject
For submission notifications, you can edit the from name and the subject in the template. Note that any subject you set will override the subject
field you set in your form. If you’d like you can also include any of the field names using the same mustache context as above. For autoresponses, this information can be set in the plugin settings.
Previewing and saving
At the bottom of the page, click Preview, to see how your template would look in a sample email. Once you’re ready for your changes to go live, click Deploy. If you change your mind before deploying, you can click Revert.
Applying the Template
For submission notification templates, you can set the template in the form's settings tab. For autoresponses, you can set the template in the autoresponse plugin's settings.
This feature is only available for forms that are in a project. If your form isn't showing an option for custom templates, you can visit your forms list to ensure that the form is in the correct project. If it is not, you can move the form to a project in the form settings tab. If the templates option is still not showing, check your billing details to make sure you have the Business plan.