Form Integrations allow you to submit your list entries to third-party services automatically. Once you enable an integration, all new entries to that form will be sent to the service you configured.
Note: Pre-existing entries are not retroactively submitted.
From the Campaign Builder, click the Widget Settings icon on your Form Container, then click open the Advanced section using the link on the left. Then, in the Integrations subsection, click the Configure integrations button.
This will open the Integration Settings pop-up; you'll then want to click the Mailchimp or Webhook option, depending on the integration you'd like to establish.
What does it do?
Mailchimp is a newsletter marketing service that allows users to design, send, and track email newsletter campaigns. The Mailchimp integration can be configured to add the entrant's details to the Mailchimp list you choose.
- MailChimp requires that users "opt-in" to receive your newsletter, so you must have a boolean (yes/no) checkbox field on your form for this purpose. If you don't have one when you set up your integration, you'll see the following warning.
- MailChimp also requires an email address, so you must have an email address field on your form. Similar to the checkbox, if you don't have one when you set up your integration, you'll see this warning.
- Enable integration - Checking this box enables the Mailchimp form integration.
- Mailchimp API Key - Use this field to add your API key. The key can be found by clicking Mailchimp API Key, or inside your MailChimp account under Account > Extras > API Keys.
- Mailchimp audience - This drop-down allows you to select an audience from your Mailchimp account; this is where the entries will be sent when the form is submitted.
- Choose a field for the opt-in checkbox - With this drop-down, you can select a checkbox from your form to use as the opt-in field.
- Send this notice to new subscribers - Select the notice sent to your new entries from Mailchimp. These notices are configured in your Mailchimp account.
- Mailchimp Tags (optional) - This allows you to add Mailchimp tags to entries that are submitted via ShortStack. Use the ShortStack Field drop-down to select a custom Text or List Field (which can be hidden, if desired) to set this value for each entry.
In this section, you'll see three columns: Mailchimp Label shows the fields ("labels") you have established in your Mailchimp account. The next column, Mailchimp Type, lists how Mailchimp has classified that specific field on its end. The drop-downs in the ShortStack Field column allow you to tie a specific field in your ShortStack form to the corresponding Mailchimp label - select the field from the drop-down that you want to map to the selected Mailchimp field.
What does it do?
A webhook is a piece of code that allows users to pass information collected in one place (in this case, your ShortStack form) and pass it to a third party.
Writing/creating a webhook from scratch requires considerable coding knowledge, for which we wouldn't be able to provide support. We recommend using a program called Zapier to set up webhooks for third-party apps for which we don't have native integrations.
In our Setting Up a Webhook with Zapier help doc, you'll see step-by-step instructions on how to get webhook code generated using that tool.
Choosing/Adding a Profile
To set up a webhook, you'll need to choose or set up a webhook profile - each profile contains specific settings for what data from your entries is sent. To select an existing profile, you'll click the profile to select it, then click Select at the bottom. There are also icons on the right to duplicate or edit each profile before selecting it, if needed.
Once you've selected a profile, you'll be directed back to the Integration Settings pop-up, and the name of the profile you selected will be displayed.
To add a new profile, click the Add button at the bottom of the Integration Settings pop-up and the Webhook Profile Details pop-up will appear; this is where the bulk of your webhook setup is done on ShortStack's end.
- Profile name - This field sets the name of this webhook profile.
- Profile description (optional) - Write a short description of what this profile will be used for; while this is optional, it's recommended to help keep profile organization neat and tidy.
- Webhook URL - Whether you use Zapier or write your own webhook code, you'll end up with a URL to use for your webhook - paste that URL into this field.
- Content type - With this drop-down, you can set up the type to be either application/x-form-www-urlencoded or application/json. This should automatically populate once you paste in your URL, and should only be changed if you understand the difference between the two types.
- Secret key (optional) - Add a secret key here if you're planning on using one to secure your webhook. More information on this can be found in our Secuing Webhook Form Integrations help doc.
In this section, select the fields that contain the data that you'd like to be captured via the webhook. You can change the order of the fields by clicking and dragging the icon on the left side of each field. To edit any specific field, click the icon, and to remove the field from the profile entirely, click the icon. You can also toggle the display of how the field names appear by clicking Toggle Display.
If you need to add more fields, or a standard field that isn't already shown, click Add One Field or Add All Standard Fields at the bottom of the Field Mappings section.
Once you've finished setting up your mappings, click Save at the bottom. Then, click your newly-created profile in the Select Webhook Profile pop-up, and click Select to use it.
Most integration errors are caused by one or more of the following issues:
- The external service's fields have changed.
- The external service contains a required field that the ShortStack form isn't collecting.
- The account information (API Token, webhook URL, etc.) has changed and needs to be updated.
- The external service is currently inaccessible.
When ShortStack has trouble sending an entry to an integrated service, the error will be noted within the affected entry in your ShortStack form database.
To identify errors:
- Select Lists from the main menu.
- Click the name of the list to view its entries.
- Any entries that experienced integration errors will display a yellow warning icon. Click the icon for details on the error.