Make Your Mailchimp Sign Up Process Look More Pro


Make Your Mailchimp Sign Up Process Look More Pro | byRosanna

If you're just starting out, a free Mailchimp account is a great place to start with email marketing.


It has great customisable email templates, easy list management and an intuitive interface, plus it's super easy to integrate into any website - especially Squarespace! However, even once you've created and designed a sign up form that connects to Mailchimp on your website, there are other steps in the sign up process that might like kind of... basic:

  • Opt-in confirmation email
    This is what subscribers will receive in their inbox automatically after they have submitted their email address on your website's sign up form. This step is called a 'double opt-in' is a requirement of many email marketing software companies; it means people have a chance to confirm their identity with their email address and it makes sure they definitely want to receive your email marketing.
  • Confirmation thank you page
    Once people click the confirmation link in their confirmation email, they will be taken to a Mailchimp hosted web page that thanks them for their subscription. 
  • Confirmation thank you email
    As well as seeing the thank you page, your new subscribers will also receive a thank you email to confirm that they've now been added to your list. Think of this almost like a receipt!
  • Final welcome email
    This is an optional step (you can select whether you want to send a final welcome email in your 'List Name and Defaults' settings). Some people use this step as an opportunity to introduce their business and let people know what to expect from their email newsletter, and others use this step to send their opt-in freebie to their new subscriber.
A basic, un-branded confirmation email

A basic, un-branded confirmation email

Also if you want to link to a sign page created within Mailchimp, it's important to make sure this is consistently designed to match the rest of your brand and website.


Where to find the sign up process design settings:

Mailchimp Lists

Head to the 'Lists' area of your Mailchimp account and select the list for which you want to design the sign up process for...

Mailchimp lists

Then select the 'Signup Forms' tab above the list of your email subscribers....

Mailchimp lists

And select the 'General Forms' area. This will take you to the place where you can design your sign up pages and confirmation/thank you emails:

Mailchimp Lists

It will automatically open on the 'Signup form' dropdown menu, but when you open the dropdown you should be able to see all the options that you can customise and redesign yourself.

Mailchimp sign up forms
Mailchimp sign up forms

If you want to create a signup form page with Mailchimp that you can link to with a button or text link on your website (like this!), then you can start by editing the signup form.

However if you've already got a signup form on your website that visitors can put their email address into, then you can skip this step, and select the 'Opt-In confirmation email' option to start.


How to edit the design settings:

Once you've selected which step of the process you want to customise, you can scroll down and see the three tabs of 'Build It', 'Design it' and 'Translate it'.

Mailchimp design settings

In the 'Design it' tab, you can change find the design settings for the following elements:

  • Page
    -Background (colour)
    -Header (font size, font line height, margins)
    -Outer wrapper (background colour)
  • Body
    -Foreground (colour)
    -Default Text (line height, font size, font family, text colour, padding)
    -Link Style (link colour)
  • Forms
    -Buttons & buttons hovered (background colour, text colour)
    -Field labels (line height, font family, font size, text colour)
    -Field text (font family, text colour)
    -Required text (text colour, visibility)
    -Require Legend (display)
    -Help text (text colour)
    -Errors (text colour, font weight)
  • MonkeyRewards (aka, the Mailchimp logo badge)
Mailchimp

You can play around with these design settings and view a live preview when you scroll down below. You can also click on the various elements in the preview and edit them. As you can see in the screenshot above I have added a logo to the header area; to do this you just need to hover over the header area and click 'edit' or 'use image', and upload the image you want to display there.

Mailchimp

Also, if you move on to the 'Translate it' tab, you can change what the text says in various areas, which is helpful if you want to personalise your emails further to fit with your brand voice.

Mailchimp sign up forms

You can also just hover over any areas on the preview where you want to change the text and click 'edit'. This will then open a pop-up where you can type your custom text:

Mailchimp

Once you're happy with your customisations, you can scroll back up to the dropdown menu and select the next step in the process. Now the great thing is, all your design settings should be saved! So it's just up to you to customise any text/make any translations you want:

Mailchimp
Mailchimp forms

Test Your Process:

To test the whole process, you can either start by filling out one of the sign up forms on your website with your email address, or if you don't have one, you can get the link for your Mailchimp sign up page by going to 'Sign up forms' > 'General forms' and select the 'Sign up form' option. Then directly below that you will find a unique url. 

Mailchimp

Copy and paste this into your browser and test the sign up form that way. Then you should shortly receive your 'opt-in' confirmation email (it can take up to 1 hour with Mailchimp), where you can see how your design looks to new subscribers!

All the Frenchies

Got questions? Ask below in the comments.