Articles on: Forms

How To Activate Mailchimp Integration

Collecting emails is a crucial goal for the majority of landing pages. With Unicorn Platform you can quickly hook up your Mailchimp account and start collecting emails right away. This illustrated guide will help you to set the forms up in a few minutes.

User data collected by Mailchimp

Updated on the 8th of July 2022. Mailchimp has changed its interface, so I have changed the screenshots below.

Unicorn Platform offers predesigned and precoded AJAX forms (so-called Diaforms) which work out of the box:

These magical forms do this:

Engage users to subscribe to your newsletter.
Collect emails and send them to your Mailchimp list via AJAX.
Show server or network errors.

All you need to activate it is to copy-paste a unique attribute from your Mailchimp account. Here is a few steps guide to set the forms up:

1. Log in or create an account

Log in to your account, or create an account if you are not registered yet.

Mailchimp log in screen

2. Go to "Audience" and navigate to the "Signup forms" page

Mailchimp Audience dashboard

Step 3. Choose “Embedded Forms”

Signup forms options

Step 4. Skip editing the form and click on "Continue"

Editing the form

Step 5. Copy the action

Here you need to copy the form action from the code. To find the right section of the code, use the search on the page with the keyword "action" (Cmd+F or Ctrl+F in most browsers).

Selecting the necessary string of code

Select and copy the value of the action. Please do not include the quotes.

Example of the correct form action:

Step 6. Insert the action

All you need to do is to paste the extracted action value into a Unicorn Platform component which contains a Mailchimp form.

Inserting the action into a form component

That’s all! Congratulations! Now your form will collect visitors’ emails and send them to your Mailchimp list.

Additional form fields

If you want to collect more types of data (such as names, phones, websites, etc.), you will need to perform an additional configuration.

First, add the required fields to a Unicorn Platform form.

Unicorn Platform form editor

By clicking on the gear icon, open the settings for a field and check its name.

Default name of the field

In Mailchimp, go to Signup forms > Settings tab > Audience fields and |MERGE| tags.

Mailchimp dashboard

Check if the field name in Unicorn Platform matches one of the default names in Mailchimp.

Name of the fields in Mailchimp

The name of the field "TEL" in Unicorn Platform form editor does not match the field name in Mailchimp which is "PHONE". To avoid losing data from the submitted form, we need to match the field names. We can change it both in Unicorn Platform form editor and in Mailchimp settings. It doesn't matter where exactly, the main thing is that they match.

Comparison of Unicorn Platform and Mailchimp form field names

In this case, we have changed the field name in Unicorn Platform to match the field name in Mailchimp.

Make sure to write field names in upper case.

Matching field names in Unicorn Platform and Mailchimp

Creating new fields in Mailchimp

Let's say you want to add a website field to your form.

"WEBSITE" field in Unicorn Platform

By default, Mailchimp doesn't have a field named "WEBSITE" so we need to create a new one. To do so, click Add A Field.

"Add A Field" button

Select a field type to add. In our case, it's Website.

Selecting a field type

Change the name of the field to match with Unicorn Platform's field, i.e. "WEBSITE" (check the name of the field in the form editor in Unicorn Platform) And click on Save Changes.

Name changing of a new field

Facing difficulties setting up the integration? Feel free to contact us via support chat 🙂

Updated on: 20/07/2022

Was this article helpful?

Share your feedback


Thank you!