Build Your Mailing List Like a Boss.

Good to see you again! Last time we got you started on the idea of building a mailing list. Hope you really thought about it and realized what a valuable tool this is.

And of course, we’re partial to Web Form Builder’s integration with MailChimp. So let’s pick up where we left off and dive into some bananas!

Setting Up a MailChimp Newsletter
Now, head off to the MailChimp website and sign up for an account if you don’t have one. Click the Lists tab at the top of the page, then Create List, filling out the fields with the proper information. Once you’ve saved your newsletter, look for the link that says Forms on the Lists overview. Click it!

You don’t need an especially pretty form, since you’re going to create the form people actually use in Form Builder. You just need to include the fields you want on your form here, so Form Builder can properly communicate with MailChimp.

Add the fields you want by clicking them in the right column. You need an “email address” field, but you may want to include fields for a name, checkboxes that determine other preferences, and more. If it’s not included here, Form Builder can’t send that information over to your list. Don’t worry too much though, because Form Builder will still store all information and MailChimp has an import function so you can always add it later if you feel you need it.

Click Save & Exit. The next step is to create your form in Form Builder—but first we need your MailChimp API Key. Go to Account > API Keys & Authorized Apps.

Building a Mailing List Signup Form
It’s time to open Web Form Builder, yay! If you don't have it yet, you can get Web Form Builder here. Exhausted your form limit already? Go get a better plan here (and feel the love of the entire CoffeeCup team).

Now click the Settings toolbar button, and click to the Mailing Lists tab. Enter your MailChimp API Key and click Go.

Check the Publish to List box for the mailing list you set up. Now select the list and click Match Fields. This is the most important window in the entire process!

On the left, you’ll see your MailChimp form’s fields. On the right are any elements in the current Form Builder form. You need to match an element to each field, so that information entered into that element is sent to that MailChimp field.

To quickly set this up, click Create Elements for All Unmatched Fields. You can now see that components of both services are linked together. To change this, click the drop-down next to an element and choose the match for the MailChimp field.

If this is a mailing list signup form, make sure anything but “Never” is selected in the “Subscriptions are added to this list” drop-down. You can configure your form so that a subscription is added only when a checkbox or radio button are selected.

If this form includes an unsubscribe option, make sure anything except “Never” is selected in the “Subscriptions are removed from this list” drop-down.

Note: Choosing “Always” in either of these drop-downs means a person will be either added or removed from your mailing list every time the submit button is clicked.

One more thing: See the radio buttons for “single opt-in” and “double opt-in”? That’s what we talked about before: double opt-in means the submitter must confirm their email address before they are added to the list.

Make it look good and have fun!
That’s basically all you need to do to start growing your mailing lists. You can rearrange fields (the order they appear in MailChimp doesn’t matter), add logos or image elements, change backgrounds, and much, much more.

Next time, we’ll show you how to design a couple varieties of mailing list sign-up forms. Until then, experiment and have fun!

Want more Academy lessons? Check ’em out here.