By now, we know that Splash pages are comprised of blocks, containers and elements so let’s take a look at how to add each.

Adding Blocks

There are two ways to add a block to your Splash page:

1. Within the layout tree
2. On the page.

To add a block within your layout tree, expand tools by clicking the Layout tab and click the purple plus sign at the bottom of your layout tree.

To add a block onto the page, hover over the bottom of an existing block and click the purple plus that appears as you mouse over.

From here, a window will appear, offering you ~20 options to choose from, many of which point to pre-built content blocks.

Blocks from this library are a great starting point for Designer Pro beginners because they provide a foundation that can be tweaked to fit your branding with relative ease using the accordion tools. You’ll also notice categories for Building Blocks, Shared, and Yours.

The Building Blocks category includes an empty block and a few options for blocks with simple column wireframes. These are decidedly minimal to give the designer creative freedom to build the block from scratch.

The Yours category houses all the blocks you’ve built and saved within Splash. We recommend using this category often since you’ve already done the heavy lifting it takes to build these blocks. Recycling block reduces build time and increases efficiency.

The Shared category houses all the blocks that have been shared with your organization. This means that any team member can build a block, save it, and make it accessible to everyone on the team through the Shared category.

Check out our complete walkthrough of saving and sharing blocks here.

Adding Elements

Much like adding a block, elements can be added within the Layout tree and on page. To add an element within the layout tree, expand the block in which you’d like to add your element and click the purple circle plus icon. Note: our advanced Designer Pro offering is needed to add new elements. 

To add an element on page, hover over the bottom of an existing element and click the light blue circle plus that appears as you mouse over. 

The elements category houses Splash’s library of simple pre-built elements. We call them simple because they populate with the basic foundation but often require styling. Here you can find elements such as buttons, text elements, headlines and repeatables. This is also where all of our dynamic elements live. Dynamic elements populate automatically based on the information you entered just before choosing your themes. They include:

• Date
• Venue
• Countdown
• Mapbox map
• Google map

Adding Containers

Your options for adding a container are similar to those for adding a blocks and elements, but the moment at which you add your containers may vary based on your personal preference. You may prefer to add your containers and then add/position your elements or your may prefer to add all of your elements and then wrap them in containers. Similar to elements, you need Designer Pro access to add new containers. 

To add a container first

1. Expand the block to which you’d like to add the container
2. Click the light blue circle plus at the bottom of the layout tree
3. Select the Containers category to choose from the five available options

From here you can add elements via the instructions above and then drag those elements into the container you’ve just added. 

To add elements first and then wrap them in containers:

1. Hover next to any element that will live in your container and click the box/arrow icon that appears
2. From here, collapse the container
3. Give it a descriptive name
4. Drag the remaining elements into the container

Pro tip - Be sure to collapse the container first and name your container descriptively. this will help you avoid confusion as you add more containers to your block.

Re-ordering blocks, containers, and elements

Revising the layout of your Splash page is simple. Any block, container or element can be dragged and re-ordered within the layout tree. To re-order blocks, ensure that you are on the block level and click, drag, and drop your block to its new position.

To re-order containers, expand a block, collapse containers and re-order them within the block. Elements can be targeted at the same level. Simply select, drag, and drop.

Now that you know the basics of adding these pieces of your Splash page, you’ll be designing fantastic event websites in no time. Best of luck!