How To Create A Simple Signup Form In MailerLite

Without email signup forms you won't be able to grow your email list. Here's how to build a MailerLite signup form you can place on your website.
Categories: Tags: ,
Get MailerLite now
Our articles are FREE to read. But when you buy through our referral links we earn commission. You don't pay more but we get rewarded for our hard work. It's like a salesman in a shop showing you the goods. Thanks for your support.

So you've realised that email marketing offers a fantastic way to market your product or service, despite it being called old and stale my many voices.

And you've read my article sharing the reasons you need MailerLite for your email marketing.

But how do you grow your fanbase?

In this tutorial I show you how to create a signup form which you can plug into your website so people can add their email address and start receiving your newsletters.

Sign into your MailerLite dashboard

If you haven't signed up for a MailerLite account yet, first do that.

Once you've signed up and your account's been approved, log into your MailerLite dashboard.

The MailerLite Dashboard

The MailerLite Dashboard.

Click on Forms

In the top menu you'll see a menu item called Forms. Click it.

Click On Forms In The Top Menu

Click On Forms In The Top Menu.

Click Create embedded form

For your purpose you want to create an embedded form, not a pop up or promotion. Therefore, click on the button that reads Create embedded form.

Click The Create Embedded Form Button

Click The Create Embedded Form Button.

Name the form

You can name the form anything you want. Because it's a newsletter signup form, I'm giving it the uninspiring name of Newsletter signup form.

Once you've named the form, click the Save and continue button.

Add A Name And Click The Save And Continue Button

Add A Name And Click The Save And Continue Button.

Select subscriber groups

Subscriber groups let you split up your subscribers into meaningful groups, based on topics, so you don't send irrelevant content to your fans.

For instance, on this site I add content about crowdfunding, marketing, tech, religion, politics and plandemics. I also add the occasional short story.

All of these topics are set up as categories on my website.

But since these topics vary so widely, it's best to let my subscribers choose what they'd like to read about.

That's what MailerLite's subscriber groups allow you to do. You can couple it with your WordPress website's categories and send out the right content to the right recipients.

In my case, those who don't want to see my opinion about the coronavirus don't have to. (They can choose to only get really good marketing tips and live on in the delusion that COVID-19 is as deadly as mainstream media tells them it is.)

For this tutorial I'm selecting all groups.

Once you've selected your desired groups, click the Save and continue button.

Select Your Desired Groups And Click The Save And Continue Button

Select Your Desired Groups And Click The Save And Continue Button.

Edit the subscribe form

On this page you can edit the appearance of the actual form, as well as the success message you want new subscribers to see.

The Edit Page For The Form You're Creating

The Edit Page For The Form You're Creating.

You can leave the title and description as is but it's uninspiring, so we'll change it slightly.

Edit the heading and description

Hover over the heading of the form and you'll see a few buttons popping open.

One is a pencil, the global icon for editing. Click it.

Click The Edit Button To Edit The Title And Description

Click The Edit Button To Edit The Title And Description.

When you click on the pencil, a new sidebar appears on the right hand side of the screen.

A New Sidebar Opens On The Right Hand Side, Allowing You To Edit The Title And Description

A New Sidebar Opens On The Right Hand Side, Allowing You To Edit The Title And Description.

This is what I'm adding as a heading: Sweet FREE marketing tips!

This is my new description: Want more people to visit your website, craving after your product or service? Get my FREE newsletter packed with tips and tricks and watch your traffic grow like a llama grazing the Serengeti while Kilimanjaro rises like Olympus in the distance.

Once you've added your heading and description, click Save at the bottom.

Add A New Heading, A New Description And Click Save

Add A New Heading And A New Description, And Click Save.

You'll notice the change immediately on the form itself.

The Changes You Made In The Sidebar Shows Up In The Form Immediately

The Changes You Made In The Sidebar Show Up In The Form Immediately.

Edit the button text

One of the most important aspects of a signup form is the call to action (CTA for short).

Subscribe is fine, but let's use something really Kapow!

To change the button text, hover over the button, then click the pencil icon.

Click The Pencil Icon For The Subscribe Button

Click The Pencil Icon For The Subscribe Button.

In the right hand sidebar, under the heading, BUTTON, there's a field where you can paste your new call to action, after which you must click Save at the bottom.

I'm using this for my button text: Sweeten my Marketing Knowledge.

Add Your Button Text And Click Save At The Bottom

Add Your Button Text And Click Save At The Bottom.

Your button now looks far more inviting than with the baaaw-ring standard Subscribe call to action. In my case it might be slightly melodramatic, but hey, it could actually work.

The Call To Action Button Looks More Inviting With The Modified Button Text

The Call To Action Button Looks More Inviting With The Modified Button Text.

Edit the success message

Now it's time to edit the success message.

Personalize the experience. That way you form more of a connection with your subscriber.

At the top of the screen, click on Success message.

Click On Success Message

Click On Success Message.

Edit the heading and description

The Success message also features a heading and description.

Hover over the heading and click on the pencil icon that appears.

Click On The Pencil Icon To Edit The Success Message Heading And Description

Click On The Pencil Icon To Edit The Success Message Heading And Description.

In the sidebar, add a custom heading and message.

I'm using this heading: O, thou creature of wonder!

This is my thank you message: Go to your cassette player, stick in Tina Turner's "Simply The Best" cassette tape, rewind to the beginning of her chart-topping hit, "The Best", press play and go stand before a mirror. Now smile and pat yourself on the back while you gently tap a foot to the beat. If your back's not close enough for you to reach, get someone trustworthy to pat you on the back. This is what I think of you for signing up.

You needn't make it melodramatic. Just make sure the subscriber knows you're thankful.

Once you've added your heading and description, click Save at the bottom of the page.

Edit The Heading And Description, Then Click Save At The Bottom

Edit The Heading And Description, Then Click Save At The Bottom.

You'll see the changes take effect on the form immediately.

The Thank You Message Is Now Personal, If Not Slightly Cheesy

The Thank You Message Is Now Personal, If Not Slightly Cheesy.

Edit the appearance

You can edit the appearance of the form to suit your website's colors. Or you can edit it to be totally whacko.

You can change the main background, the form background, the text style, form elements and the button.

Let's make some major changes...

Edit the form width

The first thing I do is change the form width to 100%. This forces the form to take on the width of whichever container you place it in.

Because everything is geared towards making things as easy as possible for people to do on their phones, it makes sense to use a liquid form width.

Click on Layout

In the right hand sidebar, click on Layout.

Click On Layout In The Right Hand Sidebar

Click On Layout In The Right Hand Sidebar.

Change to Fullwidth

In the popup window, in line with Layout, click the dropdown and choose Fullwidth.

Click On The Dropdown Next To Layout And Choose Fullwidth

Click On The Dropdown Next To Layout And Choose Fullwidth.

Click Save

Click the Save button to ensure your full width layout is saved.

Click The Save Button To Preserve The Full Width Layout

Click The Save Button To Preserve The Full Width Layout.

Add a background image

Let's add a crazy pop art flower background.

I downloaded a funky image from Pixabay, where you get totally free images to do with whatever you want (attribution-free).

Let's upload it.

Click on Background

In the right hand sidebar, click on the little circle next to Background.

Clck On Background In The Sidebar

Click On Background In The Sidebar.

This pops open a box with color and background image settings.

Click on the image icon

Next to Background image, click on the little image icon.

Click On The Image Icon

Click On The Image Icon.

Upload the Pixabay image

On the next screen (the MailerLite file manager), click the Upload image button at the top right hand side of the page.

Make sure the image is no larger than 2MB.

Click On The Upload Image Button

Click On The Upload Image Button.

Find the image on your computer. In my case it was on my desktop. Click it.

Choose The Image You'd Like To Use As A Background

Choose The Image You'd Like To Use As A Background.

Click the Open button at the bottom left.

Click The Open Button

Click The Open Button.

Wait for the image to finish uploading, then click the Select button below it.

Click The Select Button Beneath The Image Of Your Choice

Click The Select Button Beneath The Image Of Your Choice.

Selecting an image automatically redirects you to the form and adds the image to the background.

Save the background

Click the Save button to save your new background.

Click Save To Save The Funky Background

Click The Save Button To Save The Funky Background.

Changing or removing the background

If you no longer want the background, simply click the bin icon for the Background image setting.

Click The Bin Icon For The Background Image If You No Longer Want To Use This Image

Click The Bin Icon For The Background Image If You No Longer Want To Use This Image.

Edit the colors

We can't have a funky flowery frame but the form is a boring gray.

Let's do something.

Shoot, let's go crazy. It's our little world. We can't make mistakes, we can only have happy little accidents. So let's take our brush, shake it off and beat the devil out of it, then add a happy little color scheme...

Edit the form background

Underneath the heading, FORM, in the right hand sidebar, click on the circle next to Background.

Click On The Circle Next To Background Under Form

Click On The Circle Next To Background Under Form.

Next to Background color, click on the small square.

Click On The Square Next To Background Color

Click On The Square Next To Background Color.

Choose a funky color. You'll notice the form immediately changes color when you make a choice.

Choose A Color For The Form's Background

Choose A Color For The Form's Background.

Save the color.

There.

Click The Save Button To Save The Form Background

Click The Save Button To Save The Form Background.

Of course, you can always add a background image to the form, just like you added a background image to the form page, but that might look a little too retarded eighties.

Change the button color

Let's go a little crazy on the button too. But it's the last thing we do to dolly up this MailerLite form.

In the right hand sidebar, right at the bottom, underneath CALL TO ACTION, click on the circle to open a settings dialogue for the button.

Click The Circle Underneath Call To Action

Click The Circle Underneath CALL TO ACTION.

Next to Background, at the top, click on the square.

Click On The Square Button Next To Background

Click On The Square Button Next To Background.

Click on a color. This will automatically update the color of the button on the form too.

Click A Color To Change The Button's Background Color And The Button Automatically Updates

Click A Color To Change The Button's Background Color And The Button Automatically Updates.

Click the Save button to ensure the changes remain.

Click The Save Button To Ensure The Changes Remain

Click The Save Button To Ensure The Changes Remain.

Now we have a button that stands out, even against the bright blue form background.

That's it for changing the look of the form.

Let's continue on in our journey to create a simple MailerLite signup form.

Move to the next stage

Now that we've set up the form it's time to move on.

Click the Next button in the top right hand corner of the screen.

Click The Next Button In The Top Right Hand Corner

Click The Next Button In The Top Right Hand Corner.

Disable double opt-in

Double opt-in is supposed to protect you from spam signups.

This is how it works:

  1. Someone signs up for your newsletter through the signup form.
  2. That person receives an email with a link they're supposed to click to verify that they've signed up.

The problem is, many email subscribers simply won't take the time to open their email client, find the verification email and click the verification link. Therefore it's best to disable it.

It's easier to fight spam as you go, than it is to try and get people to actually sign up in the first place.

Therefore, disable double opt-in now.

To do so, simply click on the large button that reads ON in line with the text, Double opt-in. This toggles the button to OFF.

Click On The Button To Disable Double Opt In

Click On The Button To Disable Double Opt In

Double Opt In Is Now Disabled

Double Opt In Is Now Disabled.

Use the form

Now it's time to take that puppy and make it work for you. You can't create a signup form and expect people to flock to it, especially if they don't know where to find it.

Two options

There are two ways to use your new form:

  • Sharing its URL.
  • Embedding the form.

Share the URL

You can find the form I created in this tutorial at https://landing.mailerlite.com/webforms/landing/n9a6w1.

That's the easiest way to share your signup form. You simple send the URL to someone, which leads them to the landing page with your signup form.

Screenshot Of The Mailerlite Signup Form Landing Page Created For This Tutorial

Screenshot Of The MailerLite Signup Form Landing Page Created For This Tutorial.

Embed the form

The other option isn't as easy as sharing a URL, but it's not rocket science either. It involves using a special embed code to make the form display in various places you'd like it to show up, like on your website.

On your website

One of the best places to add a email newsletter signup form is your website.

I've written a detailed tutorial you can read here: how to add a MailerLite signup form to your website.

The form I created for that tutorial looks different from the form I created for this tutorial, but it's the same principles.

On social media

If you're using social media for likes and shares only, you're losing out on MASSIVE amounts of quality traffic that could be converted to fans and consequently, sales.

You should be using social media to get people AWAY from social media and onto your platform.

I wrote an in-depth post on how to share your email newsletter signup form link in various places, including social media.

In conclusion

You now have a simple signup form (with a URL) you can plug into your website or other platforms online, like your social media channels.

Or you can simply share the URL of the form with someone on WhatsApp or through email.

this form will grow your email newsletter, which is one of the best things you can do, considering how finicky paid advertising platforms like Facebook and Google Ads can be.

In future posts I'll share how to integrate MailerLite with various services so your signup forms saturate every bit of your online presence.

Sign up for my newsletter to receive those handy tips.

magnifiercrosschevron-down