Advertisement

The Tuts+ Guide to MailChimp

by

This Cyber Monday Tuts+ courses will be reduced to just $3 (usually $15). Don't miss out.

Final product image
What You'll Be Creating

Email's the original way to communicate online. Social networking may be more stylish these days, but there's nothing simpler than sending someone an email to privately tell them something. That's the reason email newsletters have recently become more popular, and why you need a great tool to send out bulk emails—and this tutorial will teach you how to use one of the best: MailChimp.

We've already looked at how to turn a Google Docs document into an email newsletter with MailChimp, but there's so much more you can do with all of MailChimp's email-specific features. In this tutorial, you'll learn everything you need to get started with MailChimp and use its tools to efficiently sent out the email campaigns you need to stay in touch with your customers and more.

Getting Started

If you don't already have an account, head over to mailchimp.com and signup for a free account. That'll let you send up to 12k emails per month to up to 2,000 people, plenty to get you started. Now, signin to your account, and you'll see the Dashboard.

Mailchimp Dashboard
The Dashboard has everything you need to get started

The Dashboard is where you can manage all aspects of your account. By default it will open on the Get Started page. There are three options listed on this page: Create and send a campaign, Create a list and Start building your audience. We'll deal with the last two first. Click on Create a list next to either of them.

MailChimp takes care of all aspects of your mailing list. You can import an existing set of email addresses, or you can create a new one. You can build a signup form that you can embed on your website to help you do this.

Assuming you didn't import a list when you set up your account, the first screen will show that you currently have no lists. Click Create List in the top right corner to get stared on building one.

start a contact list

Fill in the form that opens. You need a name for the list (this is so you'll recognize what the list is for is you have more than one), an email address and name that will appear in the From field in the recipient's email client, and so on.

Adding contacts

Scroll down to Notifications and choose how often, if at all, you want to be notified of users signing up to your list. Unless you are expecting very light use you shouldn't choose the One-by-one option. Click Save to continue.

Your list has now been created, and you'll be taken to the list management screen. Initially it will have no subscribers in it. If you have an existing list of email addresses click Import subscribers. You can import them from a spreadsheet or a wide number of web services. Pick the one you use then follow the onscreen instructions to continue.

import existing addresses
You can import existing addresses into a list

If you need to create a new list from scratch, click Set up a signup form instead. 

Signup Forms

Adding all of your subscribers by hand is a large task, though, so you'll likely want a way people can subscribe on their own. There are several types of signup forms you can create, depending on where and how you are planning to use them. 

add a signup form
There are signup forms for every type of need

General forms

General forms will produce a signup form that is displayed in a web browser. It comes with its own custom URL that you can put in an email, a tweet, or print it, and you can also create a QR code that users can scan with their phone to go directly to the form.

Get a QR code for your form
Click the QR icon to get a QR code for your form

A basic signup form is created for you by default, and you can customize it if you need to. 

The Build it tab is where you can add all the fields you need within your form. These can include spaces for users to add their address or phone number, and you can also include checkboxes to enable users to opt in to specific email campaigns (if you're planning to produce more than one) or allow you to share the address with third parties.

To add a new field simply click on one in the right hand sidebar. It will appear at the bottom of the form, but you can drag it into place with your mouse.

Highlight the field and the Field settings tab will open in the sidebar. Here you can configure the field, including adding a name and any options to appear in a drop down list.

To delete a field highlight it and click Delete in the field settings tab. Note that removing a field also deletes the data stored within it—to avoid doing this by mistake you'll need to type the word DELETE to confirm that you want to do it.

deleting fields
Deleting fields also deletes any data it holds, so be careful when editing existing forms

To style your form click the Design it tab. The Design element mostly involves changing the colours of any of the elements of within the form. You can change it to match the colours of your business or website—you'll need to know the hexadecimal or RGB colour codes for this.

style form
You can style the form to match your site

The final tab for General forms is Translate it. This will translate the form to the language of the user. Tick the auto-translate button and MailChimp will take care of this for you.

Embedded forms

The next type of form is the embedded form, a simple form that can be quickly and easily placed on your website. 

If you want to customize the fields within the form you need to do this in General forms first, then when you open Embedded form the new fields will be in place. 

configure embedded form

There aren't many options to configure with an embedded form. Add a title if required, and then use the Set form width box to specify—in pixels—how wide the form should be. This will ensure it fits in your properly without the user needing to scroll to see it all.

To be more proactive about encouraging people to sign up to your newsletter, tick the Enable evil popup mode box. This will cause the form to open on top of your web page.

All the code you need to add to your site is updated and displayed in real time in the box to the right. Simply copy all of this code and paste it into the appropriate location on your site. 

The Super Slim tab enables you to produce a very basic that collects just an email address, and Naked provides you with the raw HTML for your form if you want to customize it yourself. 

Form integrations

Form integrations are tools that automate the process for adding a form to websites built on a certain platform, like Wordpress or Squarespace, or to use them with other web services including Twitter (for advertisers only) and Wufoo.

other services

Other Form Types

The other form options are Facebook form, for adding a signup form to your Facebook page, and Tablet form. This uses MailChimp's Chimpadeedoo app for iPad and Android tablets to collect signups in person on a tablet.

Once you have created and customized your form click the MailChimp icon in the top left corner to return to the Dashboard.

Campaigns

With your form set up, your mailing list should soon start to fill up and you'll be ready to send your first email. MailChimp refers to this as a Campaign, and it can consist of a single email or an ongoing series. 

MailChimp has several types of campaign you can use.

Regular Ol' Campaign

In most instances this is the type of campaign you will want to use. It uses a full HTML email styled to match your website containing images, links and other content.

Plain-Text Campaign

This sends emails in plain text only. They can include links and a certain level of personalization, but no images or other rich content.

A/B Split Campaign

This enables you to test two different versions of the same campaign. For instance, you may wish to test different types of offer or the placement of ads and gauge the response in each case.

RSS-Driven Campaign

An RSS-Driven campaign automatically pulls stories from your website and sends them to your users in a regularly scheduled digest.

Inbox Inspection

This campaign option enables you test how different email clients and services render the HTML in your newsletter. It's useful if you're creating heavily customized emails.

Create A Campaign

You can use the Campaign Builder tool to make your first campaign. From the Dashboard click Create a Campaign.

create a campaign

The first step is to choose who you're sending your campaign to. In most instances this will be the entire list. Click Next in the bottom right corner of the screen.

Now enter your Campaign Info. Add a name—this is for your own reference—and a subject, which will be displayed in the Subject field in the recipient's email client. Your From name and From email address should be filled in automatically. The other options can be left at their defaults. Click Next.

campaign info
Fill in all the details of your campaign

Choose A Template

There are many templates available for you to use, from Basic layouts, Themes, or you can code your own.  

choose a template
You can choose from a basic or themed template

Click the Themes tab followed by the All drop down list to select a category that matches the subject of your mail. Pick a design you like and click Select. When it opens in full size you can click Back to pick another one if you don't like it.

themes
Pick from hundreds of existing themes

Design Your Email

Designing your email is as simple as dragging and dropping element from the right of the screen to the preview area on the left. In a Theme, most of the text and foreground images can be changed, while the background elements and overall styling will stay the same.

To edit the style and content of the box, click on them. An edit pane will now open on the right of the screen. Use this box to type in your message, add images and change fonts and text sizes. It's all updated in real time in the preview window on the left so you can see how it looks. 

To add an image alongside the text, click the File Manager button and drag the image from your desktop. Ideally you should resize images before you add them, but you can resize them in MailChimp too. Double click the image in the edit pane to see the editing options. Set a new width for the image, and ensure that the text wraps around it by clicking Show image style options and setting the Alignment as Left.

edit your email
Make you edits in the right hand pane and they will show in real time in the left

Click Save & Close in the edit window to save the changes.

To change an image click on it to open the right hand pane. Click Replace, then drag and drop your new image into the window from your desktop. If you want the image to be a clickable link then add the URL via the Link option.

Change the Header

To add a logo to your mail click inside the header box and either type in the name of your company or delete the text that may already be there and click the File Manager icon and drag a logo image from the desktop.

Personalise the Mail

Personalising your email is a nice touch and easy to achieve. Click on the main content box in the preview area to open the edit window. Click on the downward facing arrow at the far right of the toolbar to view some extra tools.

adding the first name
Choose the data you want to add to your message

We're going to open our mail by saying Hi to the reader, and greeting them by name. In the text area type Hi, then on the toolbar open the drop-down menu labelled Merge Tags. From the list select First Name. The code *|FNAME|* will appear alongside the word Hi—the name that the user entered in the First Name field in your signup form will be automatically entered into the email they receive.

first name tag
The tag will be replaced by each subscriber's first name

You can add other tags from your signup form elsewhere in your email as well.

Click Preview and Test in the top menu bar and choose Enter Preview Mode to preview how your mail looks. It'll be shown in both desktop and mobile email client form. Also choose Send Test Email from the same menu.

smartphone preview
Preview your email in both desktop and smartphone formats

Ready To Send

When you have finished creating your email click Next. A checklist will show you all the steps that need to be completed, and your progress through them. Anything you've missed will be flagged, and you can also choose to edit anything by clicking the Edit button.

edit flags
Anything you've forgotten to edit will be flagged before you send

When you're happy click Send. To confirm click Send Now when prompted. It's a good idea to send a few test emails to your own account to ensure everything is working properly before sending it to all of your subscribers.

sending your email

Tracking Your Email's Performance

In the Reports section of the Dashboard you can see the campaigns you have sent along with detailed information on how they have performed. Click View Report

tracking performance
You can analyze your newsletter performance in great detail

In the Overview tab of the Reports screen for your newsletter you'll see how many of your subscribers opened your mail, how many clicked on links within it, how many mails bounced and how many users unsubscribed. Over time you will be able to use this information to optimize your campaigns to increase engagement with your users.

Send Another Campaign

 If you're happy with the design of your first campaign you can re-use it in future. Go to the Dashboard and click Campaigns. Click the arrow next to the View Report button on your campaign and select Replicate

replicate your email

This creates a copy of your campaign—all you need to do is change the subject header and the title and body of your message. The design and other standing elements will remain the same.

Conclusion

MailChimp is a fantastic service that is simple enough to enable you to send your first newsletter to your mailing list within as little as half an hour of signing up. It's also complex enough to grow with you as your needs expand. This tutorials should have given you enough info to get started using MailChimp, but be sure to leave a comment below and let us know if you have any more questions.

Advertisement