Create a custom Coming Soon page with Beaver Builder

What you’ll learn

In this tutorial we’ll show you how to create a custom Coming Soon page that you can edit with Beaver Builder. It’ll only take 5 minutes to get it set up and ready to show your customers.

Here we go!

Step 1 – Create the Coming Soon page

Login to your WordPress Dashboard and navigate to Pages > Add New and create a new page for the Coming Soon page.

In this demonstration we have named the page Coming Soon and designed it as per below.


TIP: It’s always good to have a call to action on your Coming Soon page – a subscribe form to your mailing list, or even just your phone number. Anything BUT just the words COMING SOON.

For most clients, we recommend they offer something. For example, in the above we are offering a FREE one hour consultation.  Trust us when we say no-one is going to go out of their way to call you or sign up for your service on your coming soon page if you haven’t exposed them to their service prior. But something for free? Sure, take my email!

For web agency owners – advising your clients of something like this really doing impact their opinion on your service and by telling them something like this, you’re showcasing your professionalism and reminding them why they’re investing with you.

Also, worth mentioning is that using the Beaver Builder theme we can easily disable the Header and Footer on each page by editing this Coming Soon page in the admin area, and on the right in the Page Attributes box,  selecting the No Header/Footer template as per below. You may need to remove the header and footer differently depending on what theme you’re using.


Step 2 – Take note of the slug for this new page

For example, the page we have created has the slug coming-soon, as shown below. The slug is anything after your main URL.


Step 3 – Add this simple function to your functions.php file in your theme

Go to your FTP client and then navigate to wp-content/themes/YOURTHEMENAME/functions.php

For example, in this demo we are using our theme named FemiBlogger (which you purchase here) so we navigate to wp-content/themes/femiblogger/functions.php

Once you open up your functions.php file to edit it, paste the below code at the end of the file (or somewhere else in the file if you’d prefer). If the slug of your custom Coming Soon page is different to mine, replace coming-soon below with your own slug.

The above function explained

  1. The template_redirect action hook that we are using above only triggers on front-end pages, meaning that it won’t trigger when you access your WordPress admin pages. This is why we use this action hook and it also allows us to not have to check whether the user is accessing a WordPress admin page.
  2. The !is_user_logged_in() function checks to ensure the user is NOT currently logged into the site, as we want people who log into the site to be able to see the website. This is particularly important for you as you want to still be able to edit your website while other’s only see the coming soon page.
  3. The !is_page( ‘coming-soon’ ) makes sure that the current page the user to your website is trying to view is not the custom Coming Soon page itself. If we did not have this code, the redirect would go on forever.
  4. The exit(); is VERY IMPORTANT and you must ensure you add this. It basically prevents an endless redirect.

And that’s all there is. It’s actually that easy!

How to disable the Coming Soon page

To disable the coming soon page, you just need to deactivate the function by going back and editing your functions.php file and adding a // before the add_action declaration, like below.

Advanced usage

Sometimes you might need to allow access to a couple of pages with the Coming Soon page. For example, in our demonstration here, we might want to redirect people to a separate Thank you for entering page after they fill out the subscribe form so that we can track the conversion rate.

To allow access to another page other than your Coming Soon page, update the function as per below with || !is_page( ‘thank-you-for-entering’ ). The || means OR, so we are saying if it is NOT the coming-soon page OR the thank-you-for-entering page.

Again, thank-you-for-entering is the slug of our new page that we want to allow people to see as well as the coming soon page itself.

What you can do

If you have any questions, please leave them below and we’ll answer them.

Hey! I'm Grant Ambrose,

My WordPress website generates millions of dollars in sales each year and I put together this website to help you do the same

I believe that a lot of the time, we aren't doing things that will help our business NOT because we don't know how to do it, but rather we don't even know it is possible. My website aims to change this. My website is here to help show YOU what is possible - what YOU could set up in your business with WordPress to increase sales, automate tasks and (ultimately) turn your ideas into working WordPress solutions.

Leave a Comment

Your email address will not be published. Required fields are marked *

Grow your WordPress business by getting...
My best tips to your inbox!

I'll send you emails when I publish content I think will help you and your business. You can opt-out at any time and change the topics of emails you get.

This site is not a part of the Facebook website or Facebook Inc. Additionally, this site NOT endorsed by Facebook in any way. FACEBOOK is a trademark of FACEBOOK, Inc.

Scroll to Top