Video tutorial: How to create a Shopify landing page to build your email list

Most people are not going to subscribe to your email list by using the little form in your site's footer or sidebar. This is especially true if you don't offer an incentive for people to subscribe. The fastest way to quickly build up your email list is to drive quality traffic to a landing page that offers a good reason for the visitor to subscribe (like a newsletter, free email course, or discount code), and features a big signup form that they simply can't ignore.

I recently did a podcast episode about how I'm building my email list for my survival knife shop. The basic idea is this: I put up a landing page clearly explaining that I put out a free, weekly survival newsletter, and that visitors can receive it by entering their email address. The page features bullet points and a big signup form to make it incredibly easy for visitors to know what I'm offering and how to sign up.

Here is a screenshot of that landing page:

I use Facebook ads to drive traffic to this page, and about 15% of the visitors to this page sign up for my newsletter. Within 4 weeks of driving traffic like this, I went from less than 50 to over 1000 subscribers.

Email marketing is a powerful tool, so I wanted to provide a free resource to help other ecommerce entrepreneurs put up landing pages like this and start building their email lists. I know that most of you aren't designers or developers, so I've made things really easy for you. The video tutorial below will walk you through exactly how to set up a landing page like mine in your Shopify store. I'll also show you how to do things like change the colors to match your branding, change out the icons and pictures, and change the wording.

Ready to jump in? Here we go!

Before you watch the video, you'll need to download this ZIP file containing the code and images that we'll be using in the tutorial.

Extras

Arrow Colors

In the video, I talked about how to change the signup button to match the color of the arrow image. To simplify things for you, here are the hex codes for all of the arrow colors so that you can plug those into the CSS:

• Orange arrow: #f69700
• Tan arrow: #c69c6d
• Gray arrow: #c2c2c2
• Red arrow: #ff0000
• Green arrow: #81c329
• Blue arrow: #00bff3

Where to find new icons and photos

The two resources I mentioned in the video for finding icons are iStockPhoto and FindIcons.com. As far as photos, you can find some good photos on iStockPhoto, although you will have to purchase them. Free photos can be found on sxc.hu and Flickr (make sure they are licensed for commercial use). You can also find cheap stock photos on PhotoDune.net.

Need help?

Like I said in the video, feel free to leave comments below if you run into any problems.