LAYOUT BUTTON

Layout Buttons are used to transition your room to different layouts or modes. You will usually have a single Layout Button for each mode. For example, if you had a presentation room with both a speaker mode and a screen share mode, you would have two Layout Buttons. Let's explore how we can achieve this using Layout Buttons.

Let's say you have a room with two participant elements for speakers (blue squares) and a grid chat for the audience:

First, you'll want to save this layout into a Layout Button. Drag a Layout button from the Element menu down to your Notes and Controls:

Then go to your settings panel and change the text to 'Speaker Mode'

Then hit the Snapshot button under the ELEMENT category to save the current state of the Room:

Now that this layout is saved, we can create the screen share layout. Add a new Participant Video element and configure it to contain a screen share:

You'll notice that your Speaker Mode Layout Button is displaying a warning:

This means the Layout Button doesn't have a position for one of the elements in the Room (the element we just added). We'll need to update the snapshot to include this new screen share element. Since we don't want the screen share to show in layout, make the screen share element invisible:

Then select the Layout Button and hit the Snapshot button in the settings panel again. This will add the invisible screen share element and you'll notice that the warning goes away.

Now, let's create our screenshare layout. Move the speakers to the side and make the screenshare element visible and large:

Then add another Layout Button to your Notes and Controls, change the text to 'Screenshare Mode', and hit the Snapshot button in the settings panel:

You can now test out your layouts! Go to Director mode and click on the two buttons. You'll see that your Room is switching between the two modes:

Let's say you actually want the speakers in screen share mode to be on the right. You can easily edit a layout by using the Edit button in the settings panel:

You will see this notification:

Now you can make any changes to the elements of the room that you want and then hit 'Save' to update your layout. Or, if you don't want to change anything, just hit 'Cancel'.

Advanced Topics

If you have a lot of Layout Buttons in your Room and then find the need to add another element, it can feel like a lot of work to update all your Layout Buttons. Luckily, under the ACTIONS of the new element, you can use the Update for Layout Buttons button:

This will let you add or update element to all Layout Buttons you select via the dialog:

If you want to only update specific properties, you can click on the 'choose properties' link to bring up a property picker:

Sometimes, you won't want certain elements to be included in your layout snapshots. To exclude them, use the Exclude Elements with Tags setting:

This will prevent any elements with those tags (comma-separated) from being affected by the Layout Button.


Did this page help you?