Why You Need a Coming Soon Page Before You Launch and How to Create One

If you’re planning on launching a site, you need a coming soon page. And no, I’m not talking about one of those default coming soon pages that your host displays before your site is setup. No, I’m talking about a super informative, eye-catching coming soon page that you can use to grow your site before it even launches. Here’s everything you need to know about why you absolutely need a coming soon page and how to go about creating one.

What is a coming soon page?

Like the name says, a coming soon page is a page that announces that a site is coming soon. But while a coming soon page can be as simple as a page saying “coming soon,” it’ll be much more effective if you use the space wisely. We’re talking including a call to action and adding personality. A coming soon page will often be your brand’s first impression. Don’t you want to make it count?

What should you put on your coming soon page?

So knowing that your coming soon page has to work for you, what exactly needs to be put on it? Ultimately it depends on your goals, but here are a few things:

About blurb

What good is a coming soon page if people have no idea what your site is about? Don’t make them guess! If you want to get them excited in anticipation of your launch, let them know what’s coming soon. Be short, specific, and interesting. This doesn’t have to be 5 paragraphs in length. Think of an elevator pitch for your site and include that.

Launch date

Coming soon can mean a lot of things. Will your site be launching in 2 days? A week? Two months? If you’ve made your about blurb interesting, people will want to know exactly when they can expect you to launch, so give them a date!

If you don’t have a concrete date planned yet, then feel free to leave it off. Or give a time frame (i.e. Spring 2017), but don’t do this unless you’re absolutely certain you’ll be launching within this timeframe. When you find out the date, add it to the page.

Call to action

You’re getting traffic to your site and people are getting excited about what’s to come. But what good is that really doing you? Sure, people may remember to check out your site when it launches, but the majority will simply forget your site even existed. This is where you need a call to action. Calls to action could include signing up for your email list or following you on social media. The goal is to get people to take action, preferably somewhere you can keep in touch with them (this is where an email list comes in handy). Then when launch day arrives, you can notify them that your site has launched, which allows them to check out your site and celebrate with you.

Why do you need a coming soon page?

You now know what your coming soon page needs, but why do you need one in the first place?

Informs people what to expect (and when!)

Remember that about blurb your coming soon page needs? Well as I mentioned before, it’s purpose is to inform people what your site is about. You can’t expect them to get excited about your site launch if they don’t know what your site is about. Give them the details and they’ll have a reason to want to check out your site when it launches. And of course, the date your site is expected to go live is equally important. A date gives them a time to check back in with you. Without it, no one will know when your new site is going live.

Allows you to start building an email list

The number one way to stay in touch with your audience is via your email list. Social media may be great, but things are constantly changing (remember MySpace?). But you own your email list and email is not going anywhere anytime soon. Plus, it is a direct connection to your audience. If you send them an email, they will get it (unlike Twitter or Facebook where they might not see your posts). Since an email list is incredibly important, the sooner you start to build one, the better. Might as well start with your coming soon page!

Gives you a head start on SEO

Google is constantly crawling the web. What happens if it lands on your barebones coming soon page? Or worse, what if you don’t have a coming soon page? Well, you’re not going to see much of a benefit SEO wise. But a coming soon page that actually includes information will do you a favor. Now you might not exactly climb the ranks of Google, but it’ll at least tell Google you’re there. Then when your site does launch, you’ll have a head start on Google.

Keeps your site private while you prep for launch

Building a successful site takes time. Sure you can start building on your host and just never tell anyone about it until it’s done, but as we’ve discussed, a coming soon page is beneficial. The good news is that a coming soon page can hide the rest of your site from prying eyes. This means that you can work behind the scenes on making your site awesome, all while building your email list.

How to create a coming soon page in WordPress

Now that you know the importance of a coming soon page, it’s time to create one!

The first step is to install and activate the Coming Soon Page & Maintenance Mode by SeedProd plugin.

Once that’s done go to Settings > Coming Soon Page & Maintenance Mode. First up is to enable coming soon mode, so select it and click save changes.

Now it’s time to start styling our coming soon page. If you have a logo, upload it. If not, you can quickly create one in Photoshop or Canva. Or you can just leave the field blank.

Next, let’s add some content. I usually like to leave the headline field blank and instead just enter all my content into the message field, but it’s up to you.

Enter your about blurb and below, add in an embed code for your email list.

Sidenote: When entering your embed code, you’ll need to switch over to the text editor. Once you’ve added the code, you can switch back to the visual editor.

Once the content is added, save your changes. Now click on the live preview tab to see what it looks like.

Since we haven’t gotten around to doing any styling, your coming soon page should look a little something like this:

Sidenote: I styled my opt-in form via my email marketing program, which is why it looks styled and the rest of the page doesn’t.

Not exactly inviting, is it? That’s okay, we’ll just have to do some styling. Click on over to the design tab.

This is the page where we can select a background color or image, choose link and text colors, and add custom CSS, among other things.

First up, I’m going to give my page a background color. If you’d rather use an image as your background, you can do that instead. Remember to set the background repeat, position, and attachment though.

Next up is the content area. By default the content on your coming soon page is set to 600px wide. If you’d rather make it larger (or smaller) you can do that in the content section.

The other option in the content section is so enable a well. This puts your content in a box, which can be helpful if you’re using a busy background image.

Now, let’s customize the text. Choose colors for your text, links, and headline, then choose a font from the dropdown.

Save your changes again and click the live preview tab. Do you like what you see? If not go back and do some more tweaking. If there are no options for the changes you want to make, it’s time to break out the custom CSS.

In my example, I want to change the following things:

• Make font larger
• Uncenter content
• Make the content well white
• Add padding to content well
• Increase the space between my opt-in form and text

Using inspect element, I’m going to figure out what classes I need to target in order to style the above things to my liking.

When hovering over the content well, I can see that I need to target #seed-csp4-content. I’m going to scroll down to the bottom of the design tab and enter the following into the custom CSS field:

#seed-csp4-content {
     background-color: #fff;
     border: 0;
}

That changed the content well to white and removed the border.

I still need to add padding though, so I’m going to add padding: 60px to the above code, like this:

#seed-csp4-content {
     background-color: #fff;
     border: 0;
     padding: 60px;
}

Now I’m going to make my text larger and uncenter it, using the following:

.seed-csp4 body {
     font-size: 20px;
}

.seed-csp4 body p {
    text-align: left;
}

Lastly, let’s increase the space between my text and opt-in box. For this example, I’m using a MailerLite opt-in. Using the inspector, I can see that it has an id of mlb2-4020787, so that’s what I’ll use to target it.

Sidenote: For this part, you’ll definitely have to use inspect element to see what class you have to target as yours will without a doubt be different from mine.

#mlb2-4020787 {
     margin-top: 20px;
}

And I think that’s about it! The above customizations provide you with a pretty basic coming soon page, but you can get fancy with your CSS if you want.

Now I’m pretty happy with my coming soon page. There’s just one more thing I need to do to ensure that it’s set up properly.

If you go back to the content tab, you’ll see a section titled header all the way at the bottom. We need to fill out those settings.

Upload a favicon. Not sure what a favicon is? It’s the little icon that’s displayed in a browser tab.

Next, set an SEO title. This will be the title displayed in Google as well as in the brower tab.

In the SEO meta description box, enter a brief blurb about what your site’s about. This will be displayed beneath your site’s title in Google search results.

Lastly, if you have Google Analytics, this is where you’ll want to add the tracking code.

If you don’t have Google Analytics set up yet, check out this tutorial.

And that’s it! Your coming soon page is ready to go! Now announce your site to the world and start collecting emails!

Why You Need a Coming Soon Page Before You Launch and How to Create One was originally posted on Allyssa Barnes.