Create a Split-Screen Splash Page with Frost

Brian Gardner Avatar


Split-Screen Splash Page - Frost WordPress Theme

A splash page introduces a website or product with a graphical element. It directs the user to explore the site further or take immediate action, such as signing up for an email list or connecting on social media.

Perhaps your website is not fully developed, or the content is a work in progress. In this case, a splash page is a perfect way to build momentum and establish an audience—and you can do it in just a few steps.

This guide will help you create a split-screen splash page using the Frost WordPress theme. Use it as a temporary solution or as a landing page.

Here is an example of split-screen splash pages created with Frost:

Split-Screen Splash Page - Frost WordPress Theme

Creating a split-screen splash page with Frost is simple. Here are the steps:

  1. In your WordPress dashboard, go to Pages > Add New.
  2. On the right side of your screen, go to Page > Page Attributes and select the Blank page template.
  3. In the Block editor, click + to add a Columns block. Choose the 50/50 variation and be sure to change the block alignment to Full width.
  4. In the left column, click + to add a Cover block. Upload image and set the Minimum height of cover to 100vh.
  5. In the right column, click + to add a Heading block, a Paragraph block, and a Buttons block.
  6. Select the Heading, Paragraph, and Buttons blocks and group them. Apply 10% padding to the Group block for proper spacing.
  7. Publish your splash page and share it with everyone.

In List View, your splash page content hierarchy should look like this:

Split-Screen Splash Page List View

I’d love to see what you create. If you are create a splash page by following these steps, tag me on Twitter @bgardner so I can have a look.