Bring your Mailchimp forms over to Kit
Email forms play a big role in helping you grow your audience. So if you’re coming over from Mailchimp, you’ll definitely want to recreate your forms in Kit—and you’re in the right place!
In this guide, we’ll cover how you can create your Mailchimp form in Kit, regardless of whether it is a hosted signup form, embedded form, or subscriber pop-up.
And if you’re new to Kit forms, we suggest first checking out these guides to get a basic understanding of how form creation works in Kit:
NOTE: Do you use Mailchimp landing pages instead? Then check out our separate guide on recreating a Mailchimp landing page in Kit.
In a browser tab, launch Mailchimp and open the form you want to recreate in Kit. Keep this browser tab open for convenient reference.
Next, log into Kit and click Landing Pages & Forms in the Grow tab of the top navigation. After that, click the + Create new button to create a new form.
In the next screen that asks how you want to gather subscribers, select the “Form” option.
Then, choose a display format for your form. You can change this later if needed.
NOTE: To create a pop-up form, select either the “Modal” or “Slide in” display format.
The next step is to choose a form template. So go ahead to pick one that you like the best, or the one that most resembles your Mailchimp form. You can also change this template later if you decide to use a different one.
Your chosen form template will then be loaded into our form builder, ready to be customized. Don’t forget to save your work often when recreating your Mailchimp form in Kit—to do so, click the Save button at the top right of the form builder.
First, you’ll recreate your Mailchimp form’s form fields, design, and settings. For demo purposes, we’re going to recreate the look of this Mailchimp pop-up form:
Recreating your form fields
NOTE: At this time, our form fields allow for only plain text, dropdown, or checkbox inputs.
All Kit forms include the Email Address field by default. To add more form fields, click the + button in the form:
Click the new form field that has appeared in your form, then check out the right sidebar of the form builder.
To add a First Name field to your form, set the “Save as” setting to “Custom Field,” then click the “Custom field” setting to select the “First Name” option.
To add other text fields than First Name to your form, you’ll first have to create a new custom field. You may do so at this step by simply typing in the name of the custom field you want to create, and it will automatically be added to your account.
NOTE: If you want to see what's going on behind the scenes, you can create the custom field where it lives—in your subscribers’ profiles. (We recommend doing this in a separate browser tab.)
Finally, to add a list of dropdowns or checkboxes, add a new form field to your form. Then, select “Tag” in the “Save as” setting, and select either “Dropdown” or “Checkboxes” for the “Field type” setting.
For our purposes, we’re going to select the “Checkboxes” option.
After that, select the tag options corresponding to the dropdown or checkbox list options that should appear in your form.
This way, when a subscriber selects one of these list options, they’ll be tagged with the appropriate tag. (Create these tags first if you haven’t already done so.)
Renaming your form fields
The “Label” setting in the right sidebar lets you name your form fields differently from your internal names for them.
For example, we have a tag named “Photography Pros:Food Photography,” which doesn’t sound very appealing.
So we can use the “Label” setting to give a different external name for that checkbox list option.
Rearranging your form fields
To rearrange the order of your form fields, hover over the left side of a form field until your mouse cursor turns into a hand icon. From there, click and drag your form field to reorder it.
Making your form fields required
If you want to make the filling out of certain form fields mandatory, then click the relevant form field and check the “Required” box that appears in the right sidebar.
Deleting your form fields
Want to remove a form field from your form? Click it, followed by the Delete field button to delete it.
Recreating your form design
Adding and removing text
Highlight the placeholder text in your Kit form, then delete it and type in the text from your Mailchimp form.
Similarly, click your button text to update it.
Replacing images
To replace placeholder images in your Kit form, navigate to the General styles tab in the right sidebar. Click the Replace button in the Background image settings to upload and insert your own image.
Updating your form’s colors and fonts
In the General styles tab, you’ll also find options for changing the colors of your header and content.
Additionally, you can click your form text to load Header styles and Subheader styles settings in the right sidebar for changing your text’s font color, font size, and font weight. Here’s what the Header styles menu looks like:
Finally, click your form button to launch settings for customizing the button’s font color, background color, border radius, and font weight.
Recreating your form settings
Enabling or disabling double opt-in
Unlike in Mailchimp, where double opt-in applies to Mailchimp audiences as a whole, Kit’s double opt-in settings are form-specific.
To enable or disable double opt-in for your Kit form, click the Settings tab in the form builder, followed by Incentive in the left sidebar of the “Form Settings” screen that pops up.
From there, check or uncheck the “Send incentive email” option to enable or disable double opt-in respectively.
If you enable double opt-in, you’ll also need to set up the incentive email requesting subscribers to opt in to your email list. Learn more in our separate guide to the incentive email.
Recreating the thank you page
In the same “Form Settings” screen, click General.
Use the “When a visitor subscribes to the form:” setting to specify whether subscribers should see a success message, or be redirected to an external page, after signing up to your Kit form.
(For pop-up forms) Display Options
If you’re recreating a pop-up form, use the “Display Options” settings in the General tab of the “Form Settings” screen to set up when the form should appear on the page.
Happy with your shiny new Kit form? Then it’s time to use it!
Click the Publish button at the top right of the form builder:
This will load a screen displaying different options for using your form.
For example, you can grab your form’s:
HTML or JavaScript code for embedding into your webpages (JavaScript is recommended)
Hosted URL for sharing with your audience, such as via social media
WordPress shortcode for embedding into your WordPress website
So go hunt down every location where you’ve embedded or shared your Mailchimp form, then replace your Mailchimp form’s embed code or URL with that of your Kit form.
You can also connect your form to a visual automation to send subscribers automated emails after signup—and you can learn more about setting up visual automations in Kit here.
Alternatively, if you'd like expert help with recreating your Mailchimp forms in Kit, contact our migrations team and they'll be happy to assist.