You can use the steps below to create a support ticket form, or a contact us form. When you receive a new response on your form our Front addon will turn those response into new contacts and / or new messages in Front.

Create a new form and add fields

On your FormCrafts dashboard, click on New Form and enter a form name. On the next screen we will add the following fields via Add Field on the top-right corner:

  1. custom-text field
  2. one-line-text field labelled Name
  3. email field labelled Email
  4. one-line-text field labelled Twitter Handle
  5. comment field labelled Comment
  6. submit button

Our form would look like this:

Front app contact form
Front app contact form

Enable Front and map fields

Click on Addons (top-left) -> Help Desk -> Front -> Enable.

Once enabled you need to select an Inbox from the dropdown.

Once an inbox is selected we can map our form fields to their respective Front counterpart. For our form we are creating a new message, and also adding a new contact. Check Create new contact in Front.

The following Front columns are required:

  1. Sender Handle - This would usually be the email of your customer. Map a form email field to Sender Handle.
  2. To - This would be the email(s) of the agents who receive the message. Instead of mapping a field you can manually enter email(s)
  3. Message Body - You can map a comment field to Message Body, or map the string [Response Summary]. This would ensure that all the form data becomes the message body.

Map contact fields

We will map the Name field to Name, Email field to Email, and Twitter to Twitter (Handle).

Map message fields

We will map the Name field to Sender Name, Email field to Sender Handle, and [Response Summary] to Message Body.

We also mapped the text New - [Form Name] to Message Subject, and the text to Message: To. We also mapped the text tag one, tag two to Tags. You can also map fields to Tags.

Our mappings looks like this:

Front app field mapping for contact form
Front app field mapping for contact form

Your form is ready to accept new responses and turn them into Front contacts and Front messages.

Click on Preview (top-right) and test your form.