Event Website Builder

Overview

The event website builder lets you create a multi-page public site for your event using drag-and-drop blocks — no code required. Each page is fully customizable. You control the layout, content, header, footer, and color scheme independently of your organization website.

The website builder is a Pro plan feature. Go to your event's Overview page and click Event Website to open it in a new tab.

Pages

Your site is made up of individual pages — Home, Program, Sponsors, and so on. Each page has its own canvas of drag-and-drop blocks.

Creating a page

1. In the Website dashboard, click Add page.
2. Choose a template. Templates pre-fill the page with a starting set of blocks suited to the event type:
   • Conference — Hero, Program, Speakers, Sponsors, Pricing, Countdown
   • Gala — Hero, image + text section, ticket pricing, hotel info
   • Workshop — Hero, rich text overview, pricing, contact
   • Fundraiser — Hero, stats row, CTA banner, sponsors
   • Trade Show — Hero, sponsors grid, hotel blocks, contact
   • Blank — empty canvas, build from scratch
3. Give the page a name and a URL slug. The slug is the path after your event URL — for example, /program or /sponsors.

After the page is created you land directly in the editor for that page.

Managing pages

• Pages appear in the Website dashboard list. Toggle a page on or off to control whether it shows in your site navigation.
• Disabled pages are not accessible to attendees and do not appear in the header nav.
• The Home page is always the first item in your navigation. Other pages appear in the order they were created.
• Delete a page permanently from the page row. This cannot be undone.

The Editor

Clicking Edit page opens the Puck editor in a full-screen overlay.

• Left sidebar — the block library. Click any block to add it to the bottom of the page, or drag it to a specific position.
• Canvas — a live preview of your page. Click any block on the canvas to select it and see its settings in the left panel.
• Right panel — appears when a block is selected. Edit that block's text, images, layout options, and other settings here.
• Drag the handle on a block's left edge to reorder blocks on the canvas.
• Click the trash icon on a selected block to remove it.

Draft and Publish

Changes in the editor are not immediately live. There are two states:

• Draft — your working copy. Saved to the server but not visible to attendees. Click Save draft to save without publishing.
• Published — the live version attendees see. Click Publish to push your current draft live. Publishing also saves the draft first automatically.

The status badge in the editor header shows Draft, Unsaved, or Published so you always know the current state of the page.

Available Blocks

Content blocks

• Hero — full-width banner with headline, subheadline, CTA button, and optional background image.
• Rich Text — a free-text block that supports Markdown. Use for overviews, descriptions, or anything narrative.
• Image + Text — image on one side, text on the other. Choose left or right image alignment.
• Stats Row — a horizontal row of labeled numbers. Use for attendee counts, years of history, speakers, and similar figures.
• CTA Banner — a full-width banner with headline and a single call to action button.
• Video Embed — paste a YouTube or Vimeo URL. The video renders inline with an optional caption.
• Image Gallery — a responsive photo grid. Add image URLs and optional captions. Good for showcasing past events or the venue.
• Divider — a horizontal separator. Useful for visual spacing between sections.

Data-driven blocks

These blocks pull live data from your event. They update automatically as you add sessions, speakers, sponsors, and other content in your event dashboard.

• Program — your session schedule grouped by day. Pulls from published sessions. Add sessions under Program → Sessions first.
• Speakers Grid — a photo grid of session presenters with name and title. Choose 2, 3, or 4 columns.
• Pricing — your ticket tiers with name, description, and price. Includes a Register button linking to your event registration page.
• Sponsors — sponsor logos and names from your Sponsors list.
• Hotel — hotel blocks with name, group rate, cutoff date, and booking link. Add hotel blocks under Logistics → Hotel Blocks.
• Committee — a list of organizing committee members with photo, name, role, and optional bio. Enter members directly in the block settings.
• Countdown — a live countdown to your event start date. Disappears automatically when the event begins.
• Contact — a contact section with email address and optional map embed URL.

Site Settings

Go to Website → Settings to configure the global appearance of your site. These settings apply to every page — they are not per-page.

Enabling the site

The Site enabled toggle controls whether your site is publicly accessible. While disabled, your event's registration page still works — only the custom site pages are hidden. Turn the site on when you're ready for attendees to see it.

Branding

• Site title — text shown in the header when no logo is set, and in the footer copyright line. Defaults to your event name if left blank.
• Logo URL — a direct URL to your logo image (hosted anywhere publicly accessible). The logo appears in the header and footer. Recommended: PNG or SVG on a transparent background, at least 200px tall. The footer automatically inverts the logo to white, so a dark logo on a transparent background works best.
• Accent color — the primary color used across your site. It controls:
  • The Register Now button in the header
  • CTA buttons in the Hero block and CTA Banner block
  • Other block-level accent elements
  Use the color picker or type a hex code directly (e.g., #e85d04). The value must be a valid hex color.
• Tagline — a short phrase shown in the hero area or used by blocks that display a site-level tagline.

Fonts

Your event site uses Plus Jakarta Sans as the site-wide typeface. There is no per-event font picker — the font is fixed and cannot be changed.

Header

The header is generated automatically from your Site Settings. You do not build it with blocks — it appears on every page of your site.

• Logo or title — if you set a Logo URL, the logo image appears. If not, the Site Title text appears instead. Both link back to your home page.
• Navigation links — one link per enabled page, in the order they appear in your pages list. The current page is highlighted.
• Register Now button — always present. Links to your event's registration page. The button color is your accent color.
• The header is sticky — it stays at the top of the screen as attendees scroll.
• On mobile, the navigation links collapse. The Register Now button stays visible.

To change what appears in the header: update your Logo URL, Site Title, or Accent Color in Website → Settings. To change the navigation order or labels, enable, disable, or rename pages in the Website dashboard.

Footer

The footer appears at the bottom of every page. Its background is always dark (#111 near black) with white text — it does not pick up your accent color.

• Logo / title — same as the header. The logo is rendered in white (inverted). If there is no logo, the Site Title is shown.
• Footer tagline — a short line of text under the logo. Set in Website → Settings → Footer → Footer tagline. Good for a mission statement or event description.
• Footer links — currently edited directly in the database or via the API. A UI for managing footer links is planned.
• Social links — currently edited directly in the database or via the API. Supported platforms: Twitter, LinkedIn, Facebook, Instagram, YouTube. Each shows the corresponding icon.
• Contact email — set in Website → Settings → Footer → Contact email. Renders as a mailto: link in the footer.
• Copyright line — auto-generated from the Site Title (or event name) and current year.
• A Powered by CompleteEvent attribution link appears at the bottom of every footer.

Public URL

Your event site is accessible at:

https://completeevent.app/[org-slug]/[event-slug]

Each additional page lives at its slug:

https://completeevent.app/[org-slug]/[event-slug]/program

If you have a custom domain configured, the site is served from your domain instead. See the Custom Domain Setup article for details.

Tips

• Data-driven blocks (Program, Speakers, Pricing, Sponsors) show placeholder content in the editor if your event has no data yet. Fill in your sessions, tiers, and sponsors first, then add those blocks.
• Save a draft frequently while editing. The editor does not auto-save.
• Disable a page instead of deleting it if you want to hide it temporarily — for example, while building out a Sponsors page before your sponsorship packages are finalized.
• The accent color affects interactive elements across all your pages. Pick a color with enough contrast against white — a dark or saturated color works best for the Register Now button to be readable.
• The footer logo is automatically inverted to white. Use a dark logo (black or dark colored) on a transparent background for the best result. A white logo will become invisible in the footer.