How to correctly setup a "Coming Soon" page during WordPress development

Tuesday, December 9th, 2008 | Tips, WordPress

How to correctly setup a "Coming Soon" page during WordPress development

A lot of people like to start with a “coming soon” home page when they hire us to build their site. The problem is that this will reside on the default index page which causes problems when you try to run WordPress from the root directory.

You could put it in a sub-directory, run it from a demo site or a number of other things, but each causes way more work and problems than is necessary.

Here’s how to do it the right way with WordPress…

1. Install WordPress normally in the root directory of the site

2. Create an empty file in your WordPress theme called page-placeholder.php

3. Copy all the code from the current landing page and paste it into the new page-placeholder.php

4. Add this code to the top of page-placeholder.php:

<?php /* Template Name: Placeholder Page */ ?>

5. Save and upload the file

6. Login to the WordPress Dashboard and navigate to Write -> Page

7. Give the page a title of “Placeholder”

8. Scroll down to the Advanced Options and find the “Page Template” drop down box. You should see an option called “Placeholder Page” (this corresponds to the code we added to the top of page-placeholder.php)

9. Scroll back up and click “Publish” in the right sidebar (yes, you leave the page content empty)

10. Staying in the WordPress Dashboard, navigate to Settings -> Reading

11. In the top box marked “Front page displays”, click the radio button next to “A static page” and choose “Placeholder” from the “Front page” drop down box

12. Click the “Save Changes” button at the bottom of the page

And your done!

So what are the benefits of using this method?

It keeps the entire site working within WordPress. By building the site around an exterior page it only creates more things for you to keep track of and potentially forget
Launching the site is as easy as changing the options in step 10. Either select your static Home page or move it back to “Your latest posts”. Either way, it takes just a few seconds to launch the site.
If the client decides they want to move the site back out of production for some reason, it’s just as simple

And here’s a couple additional options you may want to use:

Hide the site from search engines by logging into the WordPress Dashboard and browsing to Settings -> Privacy and selecting the “I would like to block search engines, but allow normal visitors” option. This will ensure that your pages aren’t picked up by search engines until you are ready.
Password protect your pages. In general, this shouldn’t be an issue as it would involve someone first, figuring out you have WordPress installed and second, them guessing your links. However, if there are a few pages that are of sensitive nature you can easily set to password protect in the Advanced Options.

Hope this helps make your next site launch go a little smoother!

Filed Under: Tips, WordPress

Discussion

December 9, 2008

Ryan says:

I was thinking about whether or not to do something like this. I guess I don’t have to talk to you about it anymore. Silly how simple somethings are if you just take the time to think!
December 10, 2008

jacob says:

nice post
December 12, 2008

Daily Lifestream - 2008-12-11 - Jason Newlin says:

[...] 9:26am How to correctly setup a “Coming Soon” page during WordPress development [...]
January 19, 2009

WordPress Tip: How to change the domain name | Out:think says:

[...] it’s nice to build a new site behind a coming soon page, in most cases when you are designing a new site you’re doing it while a current site already [...]
April 29, 2009

NorthK says:

Thank you very much! I was making this way more complicated than it need to be…
May 6, 2009

Everyday Lady says:

Wow that was soooooooo easy! Thank you so much I was trying to figure this out for days. Love the site! It is a great resource for a do-it-yourselfer like me.
May 6, 2009

How to create a Coming Soon page for WordPress :: Christopher Ross says:

[...] Of course, you will then have to add a new Page to your website, make it the default homepage and change the theme. This option works well but causes the homepage of the site to always default back to a coming soon page, even for the developers. Tim has an article with detailed instructions on it here. [...]
May 8, 2009

Everyday Lady says:

Okay guys I need some help…now that I have the coming soon page; how do I view/edit my theme “behind” the coming soon page?
May 19, 2009

BSmalls says:

Yes, I agree with the post above me. How can I as a developer then the preview my progress on the site while simultaneously displaying the coming soon page for people who just browse to the domain?
May 24, 2009

Everyday Lady says:

I got it working just fine with the “theme test drive” plug in. Works perfect. Thanks for the post.
July 11, 2009

Matt says:

Thanks so much for this little tutorial. I was looking for a clean way to do this and you really helped me out.
February 4, 2010

Urban Jeff says:

Thanks, Tim! This really helped me with a project I’ve been working on at my day job.
February 16, 2011

Anyway to put WP in "Offline" mode - DesignersTalk says:

[...] Non plugin route – create a placeholder page template, make a new page, add placeholder page as a template, make placeholder page your front page in admin settings, and away you go! You can work on all the pages in the meantime, then just change back to home when you go live. Details here [...]
June 6, 2011

IndirectDesign says:

Thanks ever so much! I have looked everywhere for how to do this, and you have provided the only clear, concise, easy-to-follow, quick and correct method. Hooray!
August 2, 2011

Krokodil says:

Thanks for the post Joseph. Very Helpful!

@BSMALLS you can view your ‘original’ WP landing page by creating a new page in WP. Call it testing or whatever, and publish. No templates no parents no content, just give it a name and publish. Copy the permalink. The go to settings – reading and select the page you just created in ‘Posts page’ drop down. Go to a web browser and paste your permalink.