Coming Soon Pages for Beaver Builder

This follows from a post on my Simple Revolutions blog which looks at 5 code snippets to replace the need for a coming soon plugin. As that post was generic I thought I’d expand on it here for fellow Beaver Builder users.

1. Beaver Builder (without needing Themer)

Snippets 2 or 3 in my Simple Revolutions post are fine if you’re happy to redirect non logged-in users away from the root domain (ie. www.your-domain.com/coming-soon). This replaces the need for the Restricted Site Access  plugin mentioned in a Beaver Builder’s post and video on this topic.

I would use this for a page that could remain when the rest of the site goes live. Perhaps a “product” or “special offer” landing page (rather than “coming soon”). This would be to preserve any SEO good that was done.

You need to hide the page’s header and footer from logged-out users, but Beaver Builder offers control over that (see image below) and you could try my CSS snippet.

Typically, I want search engines to index the root domain (and start picking up on keywords) so I will use snippets 4 or 5.  Ideally, with my agile design process, I would have enough homepage copy to release that and effectively keep designing when live. Most realistically I’ll need to start with something more like a coming soon page.

The steps:

  1. Create a coming soon page where our homepage normally goes (assign the usual homepage SEO metadata to it).
  2. Create a “homepage: layout template and place this in the header menu (as “home”) using a custom link.
  3. Use snippet 5 to redirect to home (and make public the privacy,  thank-you and contact page).
  4.  When the home template is ready enough to go live we can simply save to the real home page.

Of course,  you see the coming soon page every time you go to the front end, but I don’t mind that as it makes it quick to update and after you click on home all seems normal again.

Beaver Builder Lite user do not have templates and would need to use pages instead.

Hide Beaver Builder Headers Footers Coming Soon 01

2. PowerPack addons for Beaver Builder

This is my “go to” plugin when I need extra modules for Beaver Builder. I believe it is the only coming soon option made specifically for Beaver Builder.  It is what Beaver Builder’s own post and video  concentrates on it . PowerPack explain it well on their site and it has all the things you might expect from a standalone coming soon plugin:

  • The ability to whitelist IP or give a secret access key
  • The ability to set it on a timer
  • Set which pages and roles are included and excluded.
  • You can chose pages or templates and set to coming soon or maintenance mode.
  • They also have a bunch of templates too.

 

Coming Soon Powerpack Beaver Builder

3. Wrangling Beaver Themer’s conditionals

This is more of an exploration into what can be done with Beaver Themer.  As a coming soon page solution it’s probably too convoluted. You might only want this if needing t5o use cookies, referring URLs and variable URLs to offer entirely different coming soon pages to different audiences.

The Steps:

  1. Assign a “Singular” Themer template to the homepage with the “User Login Status” to Logged in.
  2. Assign a “Part” Themer template to the same page with the  “User Login Status” to Logged out.
  3. Set Themer Header and Footer Templates  to “User Login Status” equals Logged in.

The actual HomePage has no content in the editor.

The screenshot below shows the location as Page: Coming Soon – ignore me.  This was to prevent me clicking on the home page in the regular way on the Beaver Builder menu. It can be renamed to “Home” when  the Home Singular template is off.

Coming Soon Beaver Builder.2

Below shows the  alternative Coming Soon “Part” assigned to a URL variable. In the video above I use a referer url (rather than a variable shown here)

Coming Soon Beaver Builder.1

You have to make sure parts of the theme are not showing to logged-out users. With the Beaver Builder theme I could set the headers and footers globally to “none”, but this left me with some content area and the page title.  I removed that with this CSS snippet.

.home .fl-content:not(.logged-in){display: none;}

Fortunately, WordPress adds a class of .logged-in so this snippet is saying don’t display the Beaver Builder content on the homepage except if you are logged-in.

Note: Beaver Themer allows you to conditionally set visibility on rows columns and modules too. You could use cookies, referring URL and viable URL change the look of other coming soon pages. The only difference here is you can swap the whole template.

Posted in
david-waumsley-web-developer-150x150-circle

David Waumsley

A British chap who helps with websites and whatnot.  Some refer to him as a digital nomad, but he will accepts the term "fugitive" or "international bag lady".  He actually builds websites for a living. Yeah, I know!

Leave a Comment