How To Create A Landing Page To Build Your Email List (Step By Step)

1

As an online business owner or content creator, a big, responsive email list is one of the most valuable resources you can have.

You can drive traffic to your fresh content, promote your products and keep in touch with your followers.


But how do you actually build an email list in the first place?

Well, you can always put opt-in links in your articles, or add a sign-up form in the sidebar of your website.

However, the most surefire way to get new subscribers, fast, is to create a landing page for that specific purpose.

 

Simpler Than You Think

To a beginner, this can sound kind of intimidating — expensive programs, visual design and lines upon lines of code.

Thankfully, today there are some great, beginner-friendly options available when it comes to building landing pages.


In this post, learn how to create a landing page to build your email list.

I’ll show you exactly, step-by-step, how you can build a high-converting page in 20 minutes or less.

And no — you don’t need to write a single line of code.

Sound good?

Let’s begin.

 

What We’ll Be Using

In this tutorial, we’ll be using GetResponse — the email marketing platform I personally use and recommend.

It comes with an integrated landing page builder, which directly connects with your email list.


Pricier options like Clickfunnels may have more fancy features to choose from.

Still, I’ve found that it’s complete overkill when you just want a landing page to build your email list.

Use the following method instead, and you’ll get all that you need at a fraction of the cost.

 

free getresponse account

Create Your GetResponse Account

To follow along with this tutorial, use this link to create a free GetResponse trial account.

Here’s how you do it:

1. In the “Start your free trial” fields, type in your email address and desired password, and click “Create account”.


2.
Go to your email inbox and click the activation link GetResponse sent you.


3.
Enter your details in the “Complete account setup” form.


4.
Submit your phone number. Then, verify your account with a code they send you via text message.


5.
Take a guided beginner’s tour of GetResponse if you want, or explore on your own.

 

Create A New Landing page

All set!

Now it’s time to start building a landing page for your email list.create new landing page in getresponse

You can find many features on the GetResponse dashboard, such as webinars, autoresponders and newsletters.

However, for now, just click on “Create landing page” in the “Quick Actions” menu.


You’ll now be presented with a ton of different templates, which can be filtered by type (sales, webinars, signups etc.).

You can use one of them if you want to save time.

Alternatively, you can start with a blank design and make it exactly as you please.

All pages you build can be saved as templates you can use for future designs.

 

Starting With A Blank Canvas

For this tutorial, I’ll be recreating my guide’s landing page from the ground up.

That way, you’ll get to know every single feature of the drag-and-drop landing page builder.


Even in the “Build from scratch” option, you can see that there’s several template options available — which impact the basic layout of your page:

how to create a landing page


However, all of these elements can be deleted or edited.

So, it doesn’t matter too much what you start off with.


Click on a template in the “Build from scratch” tab and enter a project name for it (this can always be changed later).

Hit the “Use template” button, and GetResponse will quickly generate it for you.

 

Navigating The Top Bar

Now you’ll be presented with a whole lot of options on your screen:

getresponse landing page builder

Don’t worry, though — it’s actually very simple once you’re oriented.

To keep it orderly, let’s go through the features one by one.


1. At the top-left side, you can see the different sections of your landing page setup.

landing pages

The basic setup is one landing page and one thank you page (which is shown to someone after they sign up to your list).

You can add more pages if you want, but it’s not necessary if your main goal is to build an email list.


2.
Further right you’ll notice a symbol that looks like a PC monitor.

desktop and mobile versions

Clicking on this will show you how your landing page would look on a desktop.

Right next to it you’ll see a mobile phone icon, which lets you see how it would look on a mobile device.

You can switch between these modes at any time during the creation process.


3.
Next up is the preview button.

preview your landing page

This opens a new tab that lets you preview your landing page in its true form — without all the editing elements and with proper spacing.


4.
Then, you have the “HTML” option.

html settings landing page

This lets you directly access the code of your landing page.

Unless you have coding experience and really want to get into the details, it’s best to leave this alone.

Besides, the drag and drop editor is much easier and faster to use.


5.
Clicking the cogwheel icon will bring up the general settings of your landing page.

landing page settings

Here, you can:

– Change the page title and description that shows up in search engines.

– Upload a favicon (the small icon that shows up in browser tabs)

– And choose whether or not to enable a cookie notification.


6.
Finally, there’s a button which lets you easily save your work.

save your landing page

Remember to use this often.

 

 

Content And Design

Now, we’ll move on to the different options that make up the content and design of our landing page.

The template layout is very useful for quick and easy page creation.

As mentioned, however, for the purpose of this tutorial, we’ll delete all the pre-placed elements.

This way, you see how each creative block is used on a completely blank canvas.

 

Sections

First off, we’ve got the “Sections” block.

sections

This is used to add separate areas to your landing page.

Like the page background, these can be filled with different colors to make them stand out.

Simply double click the area and select the color panel.


To recreate the landing page of my guide, I drag and drop one section element to the bottom of the screen.

This is where I’ll place the copyright mark along with my website address (eventureclub.com).

Change its size to your liking by holding and dragging the square in the middle of the line.

 

Text

Next up is the text block — which is pretty self-explanatory.

landing page text editor

This can be placed freely throughout your landing page.

The basic text editor can be used to change the size, font, color and more.


It’s important to keep the text properly space and uncluttered.

You’ll get a better feel for this later, when all of the other elements are added to your page.


I like to add an eye-catching title, a table of contents to show people what they get, and a few lines of supporting text.

Make sure to include a call to action at the end, so people know exactly what they have to do.

 

Images

The image block can help your landing page come to life with interesting pictures and screenshots.

image block for landing page

Don’t go too overboard with this, though, or you risk drawing attention away from your signup form (which we’ll cover soon).


I prefer to use the image blocks to show off a free giveaway (aka lead magnet).

One image of the cover art, and one compilation image of some of the content is enough.

 

Buttons

The button block can be used if you want to take your visitors to another page in your signup sequence, or an external link of your choice.

button editor

Since we just want to gather email subscribers, this isn’t needed.

 

Forms

Beneath the button block, we find the signup forms.

landing page signup form editor

There are two types — static and popup.

For this example, we’ll just use the static one.


It’s important to place this “above the fold”, together with the title and first subheading.

This simply means that it’s immediately visible to all page visitors, without them needing to scroll down.

Generally speaking, this will get you a better conversion rate (more people who land on your page will sign up).

 

Extras

Note that the button shapes and text can be freely edited.

Additionally, more webform fields, such as age and country of residence, can be added if you want.

For list-building purposes, however, “first name” and “email address” is enough.


Remember to include a link to your privacy policy, which should include information about how you handle your email list.

I like to place this right underneath the signup form:

landing page privacy policy

 

Shape

Then, we have the shapes.

landing page shapes

These can be placed anywhere on your page to bring more life to it, or to highlight certain content.

Generally, though, I choose not to use them — I prefer a more simplistic look.


The only exception would be thin lines.

These can be effectively used to separate blocks of text to give your page a more structured look.

 

Webinars

Next, you’ll see the webinar block.

landing page webinar builder

To use this, you first have to set up a webinar in your GetResponse panel.

This can be easily integrated with your email list.

It’s a nice feature, but not needed for our landing page.

 

Videos

One step down you’ll find the video block.

landing page video embedder

YouTube, Vimeo, Wistia and Vidyard URLs can be embedded here.

This can be used to display a welcome message on the main page, or a follow-up message on the thank you page.

 

Social Media

Selecting the Twitter icon in the menu will allow you to add various social media sharing buttons.

landing page social buttons

These can be placed individually wherever you want to.

Still, if you decide to use them, it’s best to keep them all in one place.

 

Shopping

If you want, you can add a “Buy now” button to your pages.

landing page buy now button

Together with videos and signup forms, these can be used to create a simple sales funnel.

To activate it, you’ll first need to connect your Paypal account to GetResponse.

Since we’re not selling anything, though, we’ll skip this option.

 

Code

Finally, you have the option to add custom code to your landing page.

custom code editor

This can be used to place banner ads, for example.

Generally, though, you’ll want to leave this alone.

 

 

Finishing Touches

 

Mobile Version

While you’re adding all of these elements to your landing page, you’ll notice a flashing number beneath the mobile symbol:

landing page mobile preview

This reflects the number of changes you haven’t viewed yet on the mobile version of your landing page.


When you click on this, things may look very, very messy at first.

Don’t worry, though — once you’ve resized and spaced everything properly, it’ll stay that way.

 

Thank You Page

Once you’re done with the front end, make sure to complete your “Thank you page” as well.

I usually include a headline which says something like “Request received” or “Success!”.

Then, directly underneath, I give a short, clear description of what the subscriber needs to do next:

create a thank you page

Make sure to finish the mobile version of the thank you page as well.

After that, you’re done with the design.

Now there’s just a few simple steps left, and your landing page will be ready to go live.

 

Advanced Settings

Once you’re happy with your design, click the “Next step” button in the upper-right corner.

next step

This will take you to “My landing page settings”.

 

SEO Settings

At the top of this page, you’ll find the SEO page title and description that we covered earlier:

landing page seo settings

If you haven’t filled this in yet, you can do so now.


You can also choose to enable the “noindex” meta tag.

Doing so will stop search engines from indexing your landing page.

 

URL Settings

Next, you’ll be presented with the URL options:

getresponse landing page url settings


Here, you can choose to either use a GetResponse domain, or assign your own.

 

Using A GetResponse Domain

Using a GetResponse domain is completely free to use.

However, it will make the URL of your landing page look a bit messy.

You can select 1 of 3 alternatives:

  • Gr8.com
  • Subscribemenow.com
  • Getresponsepages.com

If you choose one of these, your landing page URL will look something like this:

“Mylandingpage.subscribemenow.com”

 

Using Your Own Domain

The more professional option is to use one of your own domains.

You might have noticed that my landing page URL simply says:

Buildamoneymakingblog.com


Do you want this “clean” type of URL for your landing page?

If so, here’s how you do it:

1. Select “Add a new domain”.


2.
Type in your full domain name, without the www prefix.


3.
Click “Add”.


4.
Log in to the dashboard of your domain registrar website (like Namecheap).


5.
In your DNS settings, add the following name servers:

  • ns-a-1.getresponse.com
  • ns-a-2.getresponse.com


6.
Save the changes.


7.
Wait until your DNS settings have been fully propagated.

This may take several hours or more.


8.
Type in the URL of your landing page to see if it’s operational.

Try signing up through the form and check if everything’s in order.

Do this on at least 2 different devices.

 

Subscription Settings

Once you’ve settled on a domain, it’s time to tackle your subscription settings:

getresponse subscription settings landing page

Here, you can choose which email list you want to connect to your landing page.


You can also choose to enable confirmed opt-in, which is recommended.

This will automatically send out a confirmation email to your would-be subscribers.

Once they’ve clicked the link in this email to confirm their intent, they’ll be successfully added to your list.


You can edit the look and content of your confirmation emails by going to:

Contacts -> Settings -> Confirmation Message.

 

Analytics & Tracking

At the very bottom of the settings page you’ll see different options for analytics and user tracking:

getresponse landing page analytics and tracking


If you want to keep general user data about your landing page, or if you intend to track conversions, you can do so here.

Supported platforms include:

  • Google Analytics
  • Google Tag Manager
  • Bing Ads
  • Facebook pixel
  • Kissmetrics
  • Mixpanel
  • Visual Website Optimizer
  • Yandex Metrica

There’s also a separate section dedicated to Google Adwords.

 

Publish

Now, we’ve been through every feature of the landing page builder.

All that remains is to publish your work!

Once you’re on the settings page, you can simply click the blue “Publish” button in the corner.

publish landing page


Wait for the page to reload, and then click the link you’re presented with:

view getresponse landing page


You’ll then see that your landing page has gone live.

 

 

Ready For Action

And there you go!

Now you know how to build a fully-functional landing page to grow your email list.


Once it’s live, you can check the number of total visitors and the signup rate at any time.

Simply click on “Landing Pages” in your GetResponse dashboard to get an immediate overview of how things are going.

Now, then, it’s time to drive some traffic, and watch your email list grow!

1 COMMENT

LEAVE A REPLY

Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.