Add a stream

To add your content to the Stream tab, navigate to the tab from the Admin panel and start adding your streams.

After reading Streaming in Brella, you can add a stream to Brella.

To share your content on Brella, follow these steps to add a stream to your event: 

  1. Go to the Stream tab on the Admin panel and enable the stream feature if you yet haven't.
  2.  Start with 'Create new.'
  3.  Add your stream title that will be showing to your attendees.
  4. Add the embed link to your stream in 'Stream URL,' and choose to enable the chat for this stream tab. 
  5. Finish with 'Save and create a new event stream.' 

add a stream

🌟Tip!  After adding your stream, you can also add Side Panel integrations to your stream and enable live chat for the stream.

πŸ‘‰After creating your first Stream, it will be displayed on the event's homepage.

Remember that all the changes you make in the admin panel will be reflected on the event site immediately. You can add as many streams as you want, and the view with various streams will look like this to your attendees: 

Screenshot 2020-09-14 at 11.18.18 AM

⚑️You cannot delete streams on Brella once you have added them, but you can disable them, so they are not available to your attendees. Toggle the button next to the stream title to enable/disable the stream. 

❗Note: Using free or open streaming providers as Twitch may result in showing to the public your broadcasted content. If your event requires a more secure streaming setting, please choose another paid platform.

Stream dimensions

Embedding live stream content to Brella is very easy thanks to the iframe technology we count on.  The stream element does not have a fixed size or ratio. It is responsive in nature., and the width and height are calculated like this:

  • iFrame width = 100 Viewport width - 200px (event side navigation) - 400px (if sidebar integrations are in place) - 64px (margins) -15px (browser scrollbar)
  • iFrame height = 100 Viewport height - 184px

How does it look in practice?

Imagine the screen size is 1920x1080. If you open the browser in full screen the viewport height will be 1001px (79px are used by Google Chrome for its navigation bar and other stuff, this might be a little different for you).

The viewport width will be 1920px (most of the full-screen browser stretch across the screen evenly, of course, there will be some exceptions.

iFrame width = 1920px - 200px - 400px - 64px - 15px = 1241px
iFrame height - 1001px - 184px = 817px

⭐ Tip! If you want to check your viewport size, check this:

⚑ Note! This is just one instance; the frame width and height will change for a person with a device resolution of 1366x768 or if she/he has 2k or 4k monitors too.


Last updated on March 2021. 

Written by Stephanie Campano Valenzuela. 


If you didn’t find an answer to your questions, please contact the Support Team here.