Step by Step: Creating My Insanely High Converting Sales Pages

**A few of the links in this article ARE affiliate links…meaning I’ll receive a commission if you choose to purchase them!  BUT, I only recommend tools I love and tools I’m a pro at using. If you ever have any questions about the systems or tools I use…simply comment below or shoot me an email at terradawn@uncorkyourdork.com. **

How To Create a Gorgeous Sales Page:

Alright guys…THIS is a big one.  I am fully aware that going into this tutorial, we are going to have some SERIOUS carpal tunnel happenin’.

Time for a stretch.

Whew!! Got THAT out of the way.  Let’s get to designing, shall we?

The Tools:

• OptimizePress (I’ll go over why this is my absolute favorite…but you CAN implement these tips using other systems!)
• Airtable
• Canva
• Mockups from Creative Market

Before we EVEN get started with the design process, I want to go over these three tools with you.  I think it’s important to know WHY I chose them…and how I use them!!

**Quick note: This ENTIRE training is a new course inside of “The Wham! Bam! Business Plan!” membership site!!  You get access to videos, downloads, the “Design Your Sales Page Imagery” bonus module, quick trainings and the WBBP forums!  **

 

OptimizePress - This is a plugin that works directly on my WordPress dashboard. I’ve been in business for a while…so I’ve had the opportunity to use Leadpages, ClickFunnels, and the likes.  And you know what?  I wanted better. I wanted the ability to create a completely customizable template on my own site.  One that wouldn’t cost me a week’s worth of groceries every month. And one that would save me time…instead of confuse the hell outa me.  I literally just wanted ONE system…that would do ONE thing.

Once I designed my initial template using OptimizePress (which is what we are going to do in a sec…) simply duplicating the template and creating a new page took literally minutes.  On average, I have custom opt-in pages up in 15 minutes…instead of an hour.

The customization with this plugin is MIND BLOWING!!! Each page is broken into sections…and each section includes its own elements.

That blue area is one section with a “header” and a “text” block.  That white section underneath is a two column section (you can do all sorts of layouts!!) with an image in column one…and an image above a button in column two!!

GAH!! The common sense that this plugin has makes me smile every time I hit “publish”. We’ll go into more of HOW to do this in a sec!!

Airtable - Now…it might seem silly that I’m suggesting a spreadsheet system to use in conjunction with your page building process…but hang with me for a sec!!  For those who don’t know, Airtable is a FREE spreadsheet system that allows you to organize data AND media in one spreadsheet. So…links, images, text, contact info, video, gifs, pdf’s…WHATEVER you need!  I’ve found it invaluable for keeping track of my downloads, my login info for other sites, and my products.

For OUR purposes, I recommend creating a new spreadsheet for inspirational screen shots!  In my Airtable, I keep a running list of freebie pages, sales pages, thank you pages and more that I absolutely love! (See above screenshot.).  It doesn’t look like much…when I need to design a sales page, I can click one of those icons and pull up an entire screen shot of a sales page from a leader in my niche.

If you are a Chrome user, I HIGHLY recommend the free screenshot plugin by Concept Board. It takes full page screen shots BEAUTIFULLY and it even saves your most recent 25 for you!! It’s been a go to tool of mine for a while now.

The quickest way to find sales pages and opt-in pages for inspiration is going to be to simply head into your inbox and start clicking links that interest you!!  If you opt-in to something…make sure you are screen shot-ing the thank you page and any upsell pages you come across!!

**Quick note…we are NOOOOOOOOOOOOT doing this to copy the sales pages of other bloggers!!! PLEASE PLEASE PLEASE do not do this!!!  We are simply using these to analyze the sections of their sales pages…and figure out what sections we need to have in our own.  Sales pages ARE a form of art work and design…so please don’t think it isn’t creative theft when you blatantly steal.  Off the soap box.**

Canva - Now, I’m pretty sure most of you have heard of these guys before, but if you HAVEN’T you’ll want to head over and create your free account.  You’ll be using Canva.com to create some PRETTY amazing graphics for your new sales page!!  You’ll create headers, backgrounds, text icons and more…so this is NOT something I recommend avoiding!

Creative Market Mock Ups - The final tool in this toolbox are the product mock ups you’ll be using.  Now, this one IS a bit tricky.  If you aren’t using Photoshop already, you might want to jump into a Facebook Group to see if someone can help you out super fast!  A mock up is, in my opinion, a pretty important component on a sales page.  Your customer HAS to be able to visualize what the product will look like in their hands or on their desktop.  I use three different mock-ups in my own business.

(Click the images below to be taken to the mock-up template in Creative Market!  The middle image is created directly in photoshop with no template.)

You’ll put these images right above the “buy now” or “sign up” button. You can also check out websites like Fiverr to find someone who can do this for you quick and cheap!

Alright…let’s start designing our sales page!!  (I’m going to be going over sales pages specifically below…so you might shorten your content if you are simply offering a free PDF download!)

11 Components to a Sales Page 

Component #1: You!!!  You need to be all over this sales page!!  Add images of you working…doin’ what you DO.  Don’t be afraid to smile for the camera.I added images at the very top of the page, in the mock-up and at the bottom.  And don’t think I’m just talking about pics of yourself!!  My highest converting pages have a quick welcome video at the very top of the page!!  This can be easily recorded on a cell phone…so don’t use the “I don’t have the equipment” excuse!

Make sure that your reader knows who YOU are.  YOU are what is going to sell this product. No matter how amazing your product is, if there is no sign of the company or blogger on the page…what you’re selling probably won’t have that trust factor.

Component #2: Why you are qualified - If you were EVER going to toot your own horn, this is where I’d do it!  If you’ve been featured or published, create a bar that shows that off. Write a quick paragraph about WHY you created this and how these exact techniques helped you solve the EXACT problem your customer is now facing. Don’t just say “My name is BLEH and I own BLEH.  I’d love to introduce you to my product “BLEH”. That tells your customer NOTHING.  HOW did you come up with this solution?  How did you feel when you were in your customer’s shoes? THIS all qualifies you to teach whatever it is you are trying to sell to them!

Component #3: A blatant statement on what your product/opt-in does. - You don’t want to get so caught up in the designing and artistic merits of your product…that you forget to tell your readers what your product even is!! Write a sentence or two telling your customer exactly what the product/opt-in is…and put it somewhere near the top of the page. You don’t want your reader scrolling around trying to figure out what the hell the product is.  Actually, if they can’t figure it out, they’ll be gone in 2 seconds.

I used the statement: “The Wham! Bam! Business Plan!” Create a super simple digital subscription product…faster than a Delorean traveling to 1985!

Component #4: Benefits of your product/opt-in - You’ll need to have a clear idea of the features vs. the benefits of your product before you start designing your sales page!!  Benefits are how this product will make your customer FEEL.  A great way to find your product’s benefits is to create five sentences that start with “Imagine if…”.  The rest of that sentence is going to be a benefit! You can change the sentences later and keep the benefits…but the “imagine if…” exercise is a great way to figure out what the benefits are!

Component #5: Features of your product/opt-in - The FEATURES on the other hand are what your product has or will do!  For example, in a car commercial a benefit would be “Imagine if you had a car fit for family…and fit for fun.” but a feature would be “fold down rear seating for even more storage”.  A feature for a blogger’s PDF might be “25 page of traffic building tips and tricks” or “a BONUS free Facebook Group.”

Component #6: Mock Up and Buy Now Buttons - We talked about these earlier!!  Make sure you get these created before you hit publish!! I recommend you have these at LEAST twice on your page…at the top and at the bottom. If your sales page is exceptionally long…I’d add one more in the middle.

Component #7: Introduction to the product - Sure, we’ve gone over the features and benefits and told them what it is…but if they’ve made it this far on your sales page, you might want to formally welcome them to the product!! Start with the question “What IS ___________?”  Then spend 1-2 paragraphs answering it. Talk again about why you thought creating it fills a hole in your industry.

Component #8: Elaborate on what is inside. If you are offering a simple PDF, this MIGHT not be something you need.  BUT, if you are offering a membership, an ebook, or a masterclass…something with components, this is an important section to include.  I recommend picking 5-6 FEATURES to spotlight in this section.  What are the sections you really think are going to help your customers make that final decision?

Component #9: Testimonials - These are SUPER important and can actually make or break the sale for you!!  I recommend including testimonials, with an image of your customer, at the top of the page…in addition to near the bottom before the final buy now button. These are, generally, not needed on opt-in freebie pages…but if you have them, why not use them?

Component #10: Who is this for? Or better yet…who ISN’T this for?? This is the place to be honest!! Tell your readers who your ideal customer is, and let them know that it’s OK if that isn’t them! This helps build trust for your ideal customer…as well as weed out the customers who might become a problem for you later on down the road (refunds, complaints, etc.).

Component #11: Index - This is ONLY recommended if you are offering something like a membership site or detailed ebook.  You don’t want to overwhelm your customer…BUT if you have a product that has an extensive amount of information, it’s a great idea to provide just a quick index your reader can scan through!  This gives them peace of mind when they see that you ACTUALLY have sections that are going to be worth the money or time they are investing.

Component #12: Final message and bio - Finally, you want to add that final touch of you.  (Don’t be pervy.) Give YOUR bio in a personal way that helps your readers understand who YOU are.  This part isn’t all about the product…it’s about connecting with them.  Be fun and friendly!! DO NOT INCLUDE LINKS TO YOUR WEBSITES!! The only links you should be including on this sales page, are the links to your purchase portals or ConvertKit sign up links!

Component #13: The Guarantee - (Not needed for free opt-ins.) We’ve actually talked about this one a little bit whether you know it or not!! The guarantee is a way to help your customer feel more comfortable with their purchase. This can be with a thirty-day return policy, a 15 day trial period, an index of your content, etc.

Generally, if you are offering a one time paid product like a course or ebook, you’ll offer a refund.  If you are offering a template…something someone can download and use once then never need again, you might want to offer a quick how-to video on the main page walking customers through how to use the template.  This type of guarantee just reassures the customer that they will be able to USE your product right out of the box.

If you are offering a membership…or recurring payment product, a trial period is GREAT in lieu of a refund!!  Give them 5-30 days inside of your program to test it out, and cancel before the first charge goes through. The whole point is, you are reassuring them that they will love your product…

**Quick note: This ENTIRE training is a new course inside of “The Wham! Bam! Business Plan!” membership site!!  You get access to videos, downloads, the “Design Your Sales Page Imagery” bonus module, quick trainings, and the WBBP forums!  **

Designing In OptimizePress

OOOOOOOOK….we’ve hit the 2,000 word mark and my hands are still attached…so we’re going to keep going!!  In this section, I’m going to break down EXACTLY how I use the OptimizePress plugin to create these sales pages from scratch…then simply use them as templates for everything I need going forward!

Why pay $80 a month for Leadpages…when you can pay $97 ONE TIME for a program that lives INSIDE of your WordPress dashboard, is less complicated, and does more.  MAN I love this plugin.

Step #1: Alright…so the first thing you’ll do is buy and install your OptimizePress plugin.  They give you VERY detailed instructions on how to do this…and it only took me about 10 minutes to get everything up and running.  Once you’re done with that, you’ll want to head over to your WordPress dashboard! You’ll see a pretty new “OptimizePress” plugin installed in your side dashboard.

Hover over this and click “create new page”.

Step 3: You have two choices here!!  You can either click “blank pages” or choose from a template they’ve already designed for you.  We are going to start from scratch.  🙂 . When you click “blank pages” the screen will scroll you down to four additional templates.  Choose the first one!

Step 4: The name of your page will also be your URL, so make sure you are using keyphrases here! Name that bad boy!!

Step 5: WOOT!!!!  WE FINALLY HAVE OUR CANVAS!!!

Step 6: There are TWO navigations you’ll need to be aware of here.  The “row” which are the sections your page is made up of.  Each section allows you to designate a different colored background, a background with and image…or even a background with a silent video!!  What I LOVE, however, is that your background will automatically go from one end of your screen to another.  SO…see that image at the top of MY page?? That’s a background image!  That “as featured on” area?  That’s another “row” with a different background image.

To get those images the right size, I took a screenshot on my desktop to get the full dimensions of the area I wanted to fill.  I then created a NEW document in Canva and positioned the image where I needed it to go…keeping in mind the area that I wanted my text to be visible.

So let’s get this first row going…shall we??  With that blank page in front of you, click the “new row” button.  For this example, you can pick the second option…just one long row, no columns.  Scroll down and hit the green “add to page” button.

Step 7: Now we can customize the row with our background image (or color…or pattern) .  You should be seeing TWO buttons now, an “add element” and an “add new row”.  If you scroll OVER your new row, you’ll see the option to make adjustments to it!!  (We will add elements later.) For now, click the second button to the left which looks like a pencil.  It’s highlighted blue in the image below!

THIS is your “row options” panel!!  This is where you’ll designate a background, enable parallax, add any code you’d like, etc.  Anything you add here will ONLY affect this row…so have fun!  You won’t mess up the rest of your page!! We are going to upload an image here!

Before you do anything…click the tiny box at the top that says “is it a full width row?”.  This simply says that any “elements” you add later will go from one side to the other.

This next section is where you can plug in the hex code of the color you’d like your background to be….IF you want a color instead of an image. Plug in your hex color to both boxes!  That way you’ll get a full row of the same color.  This is NOT a detailed OptimizePress walkthrough…so I won’t go into all of the areas…but from here, if you want a background image scroll down a little farther!

Select the file you want to use, and choose “cover/stretch” in the below options.  You MIGHT like parallax…but I generally don’t.  It’s totally a personal preference.  This is simply when your background doesn’t move WITH the top layer of your screen.  It’s kinda cool…kinda.

If you LOVE your image, but have text to put on top of it…you might want to play around with an overlay!  This is a color (usually gray or white) that you put over the image…adjusting the transparency so that you can see the text on top and the image on the bottom.  When you get that all set up the way you’d like…click “done”!

I wanted to pause here and suggest that you get into a habit RIGHT NOW.  OptimizePress has never been a glitchy plugin for me…but a lot of time and work will go into these templates!!  SO, get in the habit of clicking that bit green “save and continue” button on the left hand side of the screen. This just ensures you don’t have to go back and start over if your computer crashes or something freezes up!!

In addition, you can click that “view public link” to open a new tab with your new page on it.  It’s a great way to see your progress!!

Step 8: DON’T BE ALARMED!! I know you probably just snuck a peak at your preview and saw that only about a quarter of an inch of your row was showing!!  Don’t forget…this is just a background in an empty row!!  We have to put stuff in the this bad boy!!   This is a great place to hook your reader in by telling your ready, in title form, what you are selling and what it will do for them!!  You could also use this section to ask a “what if”…or “Imagine…” question.  You can do this a few different ways. You can add a text box or you can add an image.  OR you can do what I did, and add both…sort of.

Let’s add our first element to the row!!  Click “add element. The first option you’ll see, without typing anything in the search box, is “2 column text”.  Click that!!

A gray box with Lorem Ipsum bops up…click the text…and new screen with text boxes will slide into view!!

The top box is for any text you want to appear on the left hand side of this element…and the right is…well…for the right side! Since my adorable face is on the left side of this photo…we are going to leave that top box empty.  Instead, we’ll scroll to the bottom box!  Here is where you can add text if you’d like…but we are going to add an image instead!

I created an image PNG, with a transparent background in Canva which featured my title and tag line.  I’ll upload that in this second box and center it!

Click “save & continue” and “preview”.  Chances ARE…you’ll see a LITTLE more of your image, but not enough to be satisfied.  SO, let’s talk “spacers”.

Step 9:  Spacers are going to be your BESTIE on your sales page. These simply “blank” elements that you can to your rows to expand them slightly.  They are like any other element and can be moved around by clicking the little crosshairs button that pops up when you hover over it! To add in a spacer, click that “add element” button again. Type in “spa” in the search field and you’ll see “vertical spacing” pop right up!

Give it a click.

A screen will pop up asking you to input a number.  You can either leave it completely blank and it will default at about a quarter of an inch…OR you can make it wider by plugging in a guestimate.  If you decide to leave it blank, you can always duplicate the spacer with the click of a button until your row is as wide as you need it to be.

When you scroll over that vertical space element on your page, you’ll see a row of icons appear.

The first is the pencil icon, which allows you to tweak settings of whichever element you are working on.  In this case, you can adjust the width of the spacer.

The second button is the “duplicate” button…which comes in handy when you want to duplicate a button, for example….and use it for a second time later on down the screen.  It keeps the links, the formatting…and everything associated with that element.

The third button is the gear button. This allows you to add any code or “animation” to the element…

And finally, the crosshairs (I won’t tell you what the x button does…I don’t think you’re an idiot).  The crosshairs allows you to pick the element up and drag it ANYWHERE on your page.  You can drag any element to any row you’d like!

SO,  adjust your spacers until your header and your text appear exactly how you’d like them to.

Step 10: I have LITERALLY just told you how to create the entire sales page.  Not even kidding.  From this point, just IMAGINE what you’d like your next “row” to look like…and baby, you can make it that way.  Want a blue background, white text and a video?  Adjust your row with the correct blue background hex codes, search for the “video” element and plugin your YouTube link, add your “text” elements to your row…move things around…add your spaces…and voila!!  You have TWO rows created!!

Remember, you can ALSO create rows with columns!!  If you are creating a pretty row of “features” or “benefits” use the 3 or 4 column rows to line everything up super pretty!

Holy CRAP guys, that was a lot!!  In case you skipped around…I gave you a rundown of EVERYTHING on my own sales page…and the HOW exactly I put that all together using the OptimizePress plugin!!  It may LOOK like a lot…I’ve just given you the keys to an incredibly easy kingdom.

After you’ve finished designing your FIRST page, simply use that as a template for future sales pages!!  You can find this page by going into your “pages” tab in your sidebar and clicking the “duplicate” button.  You’ll need to rename it and save it before opening it in the Live Editor…but all in all, you’ve got an easy to use, easy to update sales page at your fingertips!!

Better yet…your sales page can easily evolve over time!  With OptimizePress, it’s easy to add in new sections, change colors, update imagery and spit shine your work as  your brand evolves.

If you guys have ANY questions about the tools I’ve talked about…just ask them in the comments below, or shoot me an email at terradawn@uncorkyourdork.com!

I’m outta here!!  It’s been five hours and I need a glass of wine and some chicken.  0_0