---
title: "One Page Event Walkthrough"
slug: "one-page-event-walkthrough"
updated: 2026-10-20T19:31:55Z
published: 2026-10-20T19:31:55Z
canonical: "docs.blackthorn.io/one-page-event-walkthrough"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.blackthorn.io/llms.txt
> Use this file to discover all available pages before exploring further.

# One Page Event Walkthrough

This walkthrough builds a simple landing page for a free event, similar to the Simple UI. When you finish, you'll have a page with the event title and a video at the top, a welcome message in the middle, and a registration form at the bottom. You can then add any other components you like.

## Before you begin

1. Open an Event record in Salesforce that has one free Event Item (ticket).
2. Set the **UI Experience** field on the Event record to **Page-Designer**.
3. Open the **BT Page Designer** component on the Event record. You are signed in automatically. You see a Salesforce sign-in screen only if the automatic sign-in fails.

If you see an access error instead of the editor, ask your admin to assign you the **Blackthorn | Events (Admin)** or **Blackthorn | Events (Organizer)** permission set. See [Initial Setup](https://docs.blackthorn.io/docs/en/initial-setup).

## Start from scratch

1. In the **Choose a Template** window, click **Start from Scratch**. This gives you an empty page. You can open templates later with the first icon in the toolbar.
2. If your org already has a default layout, you see a dialog about the shared layout instead. Choose **Use a pre-made template**, then click **Start from Scratch**.

![Choose a Template](https://cdn.document360.io/f977eec0-500f-40a3-b663-724a51f78075/Images/Documentation/ss_273560h86(1).jpg)

The Choose a Template window: Start from Scratch plus seven prebuilt BT Templates.

## Add a theme

1. In the toolbar, click **Site Settings** (the second icon from the left).
2. In the Site Settings panel header, click **Theme Creator**.
3. Enter a theme name: 2 to 48 letters, no spaces or numbers. Capital letters become lowercase, and a few names that are already in use (such as light or dark) can't be chosen. Click **Next**.
4. Set the **Background**, **Primary**, **Secondary**, and **Accent** colors (hex or rgba). Each color has a paired text color. A badge shows whether the pair has enough contrast, and the wand button picks the best-contrast text color for you.
5. Click **Next** through the remaining steps, then click **Create theme** on the Review step. Page Designer fills in the remaining colors for you, and the theme is saved for your whole organization.

To check your colors for contrast, click the accessibility icon in the Site Settings panel header, then click **Run Checks**. Use **Auto-fix All Issues** to accept the suggested colors.

## Build your page structure

1. Click **Add New Section**.
2. With the section selected, open the **Content** tab in the right-hand panel. Under **Column distribution**, choose **2** columns and a split, for example **50% / 50%**, **33% / 67%**, or **25% / 75%**.
3. Click **Add new section below** twice to add two more sections. New sections start with one column, which is what the middle and bottom sections need.

You now have three sections: top, middle, and bottom.

## Add components

**Top section**

1. In the first column of the top section, click **Add component**.
2. On the **Event Details** tab, choose **Event Title**.
3. In the second column, click **Add component**, and on the **Basic** tab choose **Video**.
4. With the Video component selected, open the **Content** tab in the right-hand panel. Enter the **Video URL**, then turn on **Autoplay**, **Loop**, and **Muted** as needed. The video plays in Preview, not in the editor.

![Add Component](https://cdn.document360.io/f977eec0-500f-40a3-b663-724a51f78075/Images/Documentation/ss_1293ccg2p.jpg)

The Add Component window: Basic, Event Details, and Registration tabs.

**Middle section**

1. Click **Add component** in the middle section, and on the **Basic** tab choose **Hero**.
2. In the right-hand panel, enter a **Title** and **Paragraph** for your welcome message. You can also add a **Background Image**.

**Bottom section**

1. Click **Add component** in the bottom section.
2. On the **Registration** tab, choose **Checkout Form**.

The Checkout Form registers people for a free ticket. If the event has more than one free ticket, it uses the first one. For paid tickets, use the **Register Button** instead.

## Save, preview, and publish

1. Click **Save Layout** in the toolbar, enter a **Layout Name**, and click **Save Layout**. After this first save, your changes save automatically.
2. Click **Preview** to see the page the way visitors will, then click **Back to Editor** to return.
3. Publish the Event from the Salesforce Event record, then click **Event Page** in the toolbar to open the live page.

From here, add any other components you like.