Videosync
Back to documentation

How to use the new event site

Last updated: June 3, 2026

🚧

We’re still working on these instructions, and screenshots are still being added. Just contact support@videosync.fi if you need something you didn’t find here.

💡

The new event site toggle is only visible if the account has the new event site enabled (or if the user is a superuser).

⚠️

The new event site does not yet support all the features that the old one does. In the admin panel, only the features available on the new event site are visible.

Videosync has a new and improved event site. You can enable the new event site for an event either from the Create Event modal when creating the event, or later from the event’s Basic Settings.

Create new event modal with the Use new event site toggle highlighted

If you create an event from the event grid, you can choose the base language for the new event site directly from the menu that appears in the modal after you turn on the Use new event site toggle.

Choosing the base event language after enabling the new event site

In the event admin, you can turn the new event site on or off using the New event site toggle and click Save. After this, the admin displays all the settings available for the new event site.

New event site toggle in an existing event's Basic settings

Basic Settings

In the basic settings of the new event site, you’ll find the same options as in the old event site settings:

  • Event start date and time
  • Event duration
  • The Videosync category the event belongs to
  • Event page URL
  • Whether the event is a public IR event
  • New event site toggle
  • Cover image for the player
  • Basic event statistics information

Event site setup

Most of the settings on this page have been moved to the new Layout Editor, which you can access by clicking either the Layout Editor button in the bottom bar or the New Event Site Editor button. For editing the new event site, primarily use the new event site editor.

New event site editor button and the Layout editor button in the bottom bar

Theme colors

The new event site uses themes, which means that for each page you define the colors that its components will use.

Theme color settings in the event admin

The descriptions below explain what each theme color controls. You can set them either in the admin (above) or from the Theme panel in the editor (right).

Theme panel in the new event site editor

Background

  • Purpose: Main page/app background color.
  • Usage:
    • Page backgrounds, input fields, button backgrounds
    • Tooltip backgrounds (with foreground text)
    • Audio player controls background
    • Chat message backgrounds

Foreground

  • Purpose: Primary text color throughout the site.
  • Usage:
    • Body text, headings, icons
    • Button text on background buttons
    • Form input text
    • Navigation text

Card

  • Purpose: Surface/container backgrounds elevated from background.
  • Usage:
    • Header, footer, chat area, registration forms, modals, popovers, dropdowns
    • Speaker cards, schedule items, downloads panel, participation details
    • Most UI component backgrounds (buttons, inputs when not transparent)

Card Foreground

  • Purpose: Primary text color on card surfaces (overrides foreground on cards).
  • Usage:
    • Text on cards: footer, chat messages, schedule items, speaker cards, countdown, dial-in panel
    • Registration form labels, inputs, and choices
    • Falls back to foreground when not set

Header Background

  • Purpose: Background color for the site header bar (overrides card for the header only).
  • Usage:
    • Header / top navigation bar background
    • Falls back to card when not set

Header Foreground

  • Purpose: Text and icon color inside the header.
  • Usage:
    • Header navigation text and icons
    • Language selector
    • “Recognized” registrant bar, and sign-in / registration text shown in the header area
    • Falls back to foreground when not set

Primary

  • Purpose: Brand/accent color for interactive elements.
  • Usage:
    • Active/hover/focus states
    • Links, selected items, chapter indicators, raised-hand status
    • Search results highlighting
    • Scrollbar thumbs
    • Submit buttons (text on foreground background)
    • Active chat/transcript indicators
    • Social media button hover borders

Muted

  • Purpose: Subdued text and secondary information.
  • Usage:
    • Timestamps, placeholders, secondary labels, disabled states
    • Inactive icon colors, audio visualizer bars
    • Secondary button text
    • Dropdown chevron icons

Destructive

  • Purpose: Error, warning, or danger states.
  • Usage: Delete buttons, error messages, tooltips
  • Note: Use sparingly for critical actions.

Border

  • Purpose: Borders for all UI elements.
  • Usage:
    • Component outlines, dividers, separators
    • Focus states (in combination with primary for active borders)
    • Cards, buttons, inputs, modals, dropdowns, sections

Border Radius

  • Purpose: Defines the corner rounding for components.

Font settings

In the font settings, you can configure the fonts used throughout the event page:

  • Header Fonts: Choose the font for all headings (H1, H2, etc.).
  • Fonts: Choose the font for all main text content.

The font dropdown lists standard browser fonts as well as Google Fonts.

Attachments

On the new event site, attachments are uploaded from the admin panel and appear on the pages:

  • Below the video player in the video player section
  • Next to the controls in the audio player section
Attachment shown below the video player
Attachment shown next to the audio player controls

Video player setup

  • Event type selection: From the dropdown, select the event type as usual (video or audio).
  • Content while video player is hidden: Choose an image to display during Share, Live Paused, and Edit Recording modes. You can also select the layout here — whether the image appears as a background or next to the text.
  • Use overlay in hidden state: Enables an overlay layer on top of the image if the text in these modes appears too faint.

Presentation slides

The presentation slides work the same as in the old version. For instructions, see How to add slides to your event.

Registration

⚠️

Note: Not all registration modes are available on the new event site yet.

Currently, the new event site only supports standard registration. The available registration settings can still be found in the usual old location: Build → Registration. See Introduction to Registration features.

Profiling

The new event site includes a profiling feature that can be linked to registration, found under Build → Registration. With profiling, the user is prompted to select one of the profiles on the viewing page.

Participant profiling settings under Build → Registration

The profile name can be edited directly from the card. You can also set where each profile selection leads (delayed stream or real-time). Real-time requires Web Studio and Talkback to be enabled.

Setting each profile's destination: delayed stream or real-time stream

User choices appear in the Registration table on the dashboard.

Selected profiles shown in the Registrations table on the dashboard

Show participation details means that the profile displays instructions on how to join the webcast, such as telephone numbers or Talkback instructions. For the full breakdown of this setting, see Showing attendees how to participate (dial-in & web).

Enable phone dial-in for all registrants and Show participation details settings

Authentication

Authentication methods are not yet available on the new event site.

Audience interactions

Currently, audience interactions only include chat. On the new event site, chat settings are found in Event Admin, but the chat text is located in the Layout Editor.

To change chat text on the new event site:

  1. Chat must be enabled in Event Admin.
  2. Click the Layout Editor from the bottom bar to open the new editor. When you click the Presentation Area component, text fields appear on the right side where you can edit the chat text.
  3. Publish the changes from the top right.

The rest of the Event Admin settings are the same as on a regular event site.

How the new Layout Editor works

The new event site is built to be multilingual. By default it uses English, unless you select a language when creating the event. By default, a header element, presentation area, and footer are also created for the new event site.

You can open the Layout Editor by clicking Layout Editor in the bottom bar of Event Admin.

In the editor, you’ll find the available page components on the left side, and the settings for the selected component on the right.

The new event site Layout Editor: components on the left, settings on the right

The CSS editor can always be found under the page settings or from the bottom bar by clicking the drag icon. (You can access the page settings by clicking on the page.)

CSS editor access from the left sidebar and the bottom-bar drag icon

You can switch between different event stages from Change Preview State. Next to it, you can see the language the page text defaults to. You can change the page language here if you’ve created pages in multiple languages.

Editor top bar showing the Change Preview State and language selectors

From the settings wheel, you can create new language versions, import pages from another event, or delete the pages for the selected language or all languages.

Settings wheel menu: new language version, import page data, delete page

Next to the settings wheel, Publish saves the page, and Preview opens the preview page.

Editor top bar showing the Publish and Preview buttons

You can add new components to the page by dragging them from the left side into the page area in the center.

Clicking a component activates it and displays its settings on the right side.

How to add and modify a schedule

Open the Layout Editor from the bottom navigation in Event Admin. On the left side of the editor, click the Schedule button — it opens the schedule editor.

Schedule button in the editor's left-side navigation, with the schedule editor open

In the schedule editor you can add new items, rearrange them, modify them, and delete them. To add an item, click Add new schedule item.

Fill in the item’s details:

  • Title
  • Time
  • Description

Add as many items as you need, then click Save to store your changes.

Filling in a new schedule item's title, time, and description

To make the schedule appear on the event page, drag the Schedule element from the left side onto the page and click Publish.

How to add and modify speakers

Open the Layout Editor from the bottom navigation in Event Admin. In the editor’s left-side navigation, click Speakers.

Speakers button in the editor's left-side navigation, with the Add a new speaker button

Click Add a new speaker. A new section opens where you can fill in the speaker’s information:

  • First and last name
  • Company
  • Image
  • Title (for each language your site supports)
  • Description (for each language your site supports)
  • Links

When you’re done, click Apply.

Speaker form: first and last name, company, image, title, description, and links

In the Speakers section you can also edit, rearrange, and delete existing speakers. To make speakers appear on the event page, drag the Speaker element from the left side onto the page and click Publish.

Did we miss something? Just email our support team at support@videosync.fi ✌️