I’m a big fan of MailChimp as a starting point to build and manage your mailing lists. It offers a free account (up to 2,000 subscribers) is relatively easy to get started with and has a decent support team.
Today we’re going to look at customising your signup forms so you keep a consistent design throughout your whole signup process and ultimately gather more email addresses for your list.
The default signup form that MailChimp gives you is easy enough to generate. Click a few buttons and you’re given the necessary embed code to drop wherever you feel like. That’s all well and good but the default form doesn’t look great and can leave you with what looks like an unprofessional mailing list. I don’t know about you but I tend not to give my email address out to sites that don’t look particularly trustworthy.
Log in to your MailChimp account and choose the list that you want to edit (there’s a lists option in the menu at the top of the screen). From here we’re going to select the signup forms option from the second level menu.
From here you will be presented with some further options, the one we need is General Forms (the link icon on the yellow circle).
You should now be on a page that looks something like this…
This is exactly where we need to be, and this is where the magic happens. On the right hand side of this page you will find a number of options that will allow you to add extra fields to your signup form. It’s always useful to know more about your subscribers but it’s also more difficult to gain subscribers when you’re asking for more information. I’d recommend keeping your signup form as light as you possibly can whilst still getting the information you think you need to serve your subscribers best.
Designing Your Form
Just above the preview section of your form you should see 3 options: build it, design it and translate it. Select the design it option and you will start to see some options that will help you start to style your form.
The Page option controls the top level design settings for your form. You can edit the background, header and outer wrapper of your form. It’s a good idea to unify the style of your signup forms with your other marketing material. If you’re not overly confident when it comes to design work then just try and implement the basics,* even matching the colours with your website goes a long way.*
Replacing The List Name With Your Logo
For those that want to drop a logo in place of the list name you can hover over the list name and you will see 3 options: edit, remove and use image. Clicking use image will bring up MailChimp’s file manager which allows you to select an image from any that you’ve previously used in your MailChimp account or to upload a new image.
TIP: Before uploading a new image into MailChimp’s file manager you should make sure it is the exact size that you would like it to display at. Although MailChimp does have a basic photo editor, it’s a little bit clunky.
Choosing the Forms option under the Design it tab really starts to give you some control over the style of your forms. Here you can edit your buttons, hover states, labels, errors, required text and more.
Here’s an example of the form I used for my Freelance book Go Freelance…
The process of becoming a subscriber on a mailing list doesn’t stop at a single form. There are thank you pages, opt-in confirmations, welcome emails and more to consider. Fortunately this is all edited the same way. Just above the tabs that let you edit your email there is a drop down menu that will let you choose each form and email individually, you can then use the same process to edit each one. Some of the work you’ve already done will be carried through to the rest of your emails so you won’t need to be setting the background colour and other settings on every single form.
Hopefully now you’re in full control of the design of your MailChimp signup forms. In a future post I’ll talk about changing the tone of voice in your emails to better suit your brand.