How to Create A Coming Soon Template

In this tutorial we’ll be explaining the steps needed to take to build a coming soon page you can use over and over again!


Creating a coming soon template


In the ProPhoto customizer, switch to the design level, then click “Templates > Manager”. ¬†Click the base template or site settings template, then “create child template”



Name your design “Coming Soon Page” and click save.



Customizing the coming soon template


In the ProPhoto customizer, click and switch to the blue “Template” Level, then using the drop down at the top of the page, select the “Coming Soon Page” template you created to start customizing it.



Scroll to the bottom of the template and click the unlock button to unlock the template and click the + icon to add a new block.



Once you’ve added your new block, name it so you can identify with it. In this example, we’ve named it the “Coming Soon Block”. Click the block settings icon to customize further.



On the block appearance tab, scroll down to the “Block Background Color and Image” section. Click the edit icon for the background image upload area to upload your “Coming Soon” image.



After you’ve uploaded your image, be sure to change the setting to “cover entire element with image”. This makes sure that your image stays responsive and fills the entire block space. Click save to finish your changes.



Click the block settings icon again, and scroll down until you see the “Block Height” settings. Click the “full window height” option to set your background image to fill your entire browser screen for the block. Save when you’re done making the change.



Adding coming soon text


Go back to the layout for the coming soon template, and click the plus widget icon to add a ProPhoto text widget.



Find and select the P6 Text Widget to add one.



Set the title and add your text in the box if you want any. In this example we just added “Coming Soon” to the title area. Save your changes when you’re done.

*NOTE - If you have a background image inserted with text already added via photoshop or other image editing software, then add a ProPhoto text widget, and leave it completely BLANK by adding just a space (pressing the spacebar in the text area). Due to the nature of ProPhoto's background images needing content, if no text widget is added, then the background and consequently the block won't show.



Setting the block alignment and font style


In the layout for the template, you can hover over the block and use the menu arrows to move the block where you you want it to show on the page.



For our last set of changes, we’re going to want to center our text. Click the block settings and then click “Column Appearance”.



Scroll down to the “widget spacing” settings section and click center for both horizontal and vertical alignment.



Next scroll back up and click the “general font areas” tab. There you can select how you want your text widget’s text to display. In our example, our design already includes several dark styled (white font) text styles. So we’ve applied one of them to our widget title. You can also use the dropdown to make a brand new font style if you wish.



To center up your text even further, click the settings icon for the column your text widget is added in.



Next, scroll down and add some top padding to your column. 30-50% depending on where you want it to show up on the page.


Assigning your new coming soon template to a page


In the customizer click to switch to the “Design” level and click the “assignments” tab. Here you can assign your Home and Blog page to have the new coming soon template you created, or many other page and post types if needed.



To assign it to an individual page, without setting it globally, you’ll go to the individual page in wordpress you want to assign the template to, and select it from the template assignment dropdown in the wordpress page editor sidebar.



In this example, we’ve applied the new coming soon template to our about page.



Was this article helpful to you?

Comments are closed.