📖 Schedule & Widget | Stage 2
      Back to home
      1. Help Center
      2. I am an Event Organizer
      3. 📖 Schedule & Widget | Stage 2

      Schedule & Widget: Schedule widget in event website

      Learn how to add the schedule widget to the event website.

      HubSpot Video

      To be covered

      Intro

      Brella widget is a unique tool that you can use to display your event's agenda from Brella's Admin Panel to your website. The Brella widget will display:

      • The Brella Event Schedule,
      • A Search Box that can search day, title, speakers, tags, and locations, and lastly,
      • Filters that include Location and Theme Tags.

      Test your widget

      If you're unsure how the widget will look, this site is a great way to preview it. Copy your widget and paste it into the left column to see how it could look. Here's a short guide on what you will need to do:

      1. 👉 First, erase the text from the left bar.
         
        Screenshot 2020-04-06 at 16.30.56
      2. Then paste the widget code, copied from the Admin Panel, paste it to the left bar and click on Run.

      🌟 Congratulations, that is it! This is precisely how the Brella widget will display your event's agenda on your website! 

      Adding the widget to your event website

      1. In the Schedule tab of the admin panel, click on the Brella widget tab.

      2. Copy the script, then add it to your event website, where your schedule should be. The result would look something like this. The widget's layout can be customized further.

      ❗Note: Simultaneous sessions are sorted out alphabetically by the first tag of each session; if such, have the same start time.

       

      ❗ Important: The widget is not dynamic within time zones outside the platform. We highly suggest adding a text/banner on the hosting site to inform the participants on which time the schedule is based.

      See the example below:

      title-widget-time-zone

      Widget hosting for embed script

      widget-script-sidebar-with-filters

      If you'd like to offer your participants the option to review the agenda while watching the streams in the Brella platform or add it to a different page, now is possible by using the embed script with the free widget hosting:


      https://brella-widget-host.vercel.app/

      For this to work, add the join code of your event to the end of the above URL with the following format:  ?joinCode=XXXX2021

       

      👉 The whole URL should look like this:

      https://brella-widget-host.vercel.app/?joinCode=XXXX2021

       

       

      Adding the widget script as a sidebar

      You can add the agenda embed script to the streams, session description, or virtual booths' sidebar. If you don’t want the schedule filters to take precious space on the sidebar, adding &sidebar=0 to the end of the URL will display only the schedule, and the sidebar filters should disappear.

      👉 The full URL should look like this:

      • Yellow highlight: Your event join code +
      • Green highlight: code text to eliminate filters bar

      widget-embed-script

      To add it on the schedule sidebar:

      1. Navigate to the admin panel - Streams tab 
      2. Choose the stream in which you'd like to add the agenda embed script
      3. Click the 'Edit side panel (Integrations)' button

        sidebar-stream
      4. Add a title; for example, Agenda
      5. Add the widget embed script URL 
      6. Click 'Create' to add to the sidebar
      7. Click 'Save changes' on the stream 

      widget-script-sidebar

      Last updated - July 2022. 

      Written by Natasha Santiago. 

      natasha-rounded

      If you didn't find an answer to your questions, please get in touch with the Support Team here.

      👇