Virtual Lobby Editor for Neo Layout

InEvent offers the opportunity for you to customize your Virtual Lobby in either the Neo or Classic layout through the use of the Virtual Lobby Editor tool. This tool allows you to customize the look and feel of your Virtual Lobby without having to use CSS codes.

In this article, we will learn how to customize the Virtual Lobby in the Neo layout. To learn how to customize the Virtual Lobby in the Classic layout, click here.

Choosing the Neo layout for your Virtual Lobby

To select the Neo layout for your Virtual Lobby, follow these steps:

  1. Go to Event > Virtual Lobby
Choosing the Neo layout for your Virtual Lobby

  1. Click on Edit.
  2. Select Neo from the Lobby layout type drop-down.
choosing Neo layout

  1. In the Change template mode dropdown, ensure to select Normal.
The Virtual Lobby editor in Neo layout works only with the Normal template mode.

Select the Normal template mode
  1. Click on End to save your changes.

Where can I find the Virtual Lobby Editor?

To locate the Virtual Lobby Editor tool, go to Event > Virtual Lobby. You will see the Virtual Lobby editor on the left side menu of the page.

Virtual Lobby editor

Customizing your Virtual Lobby

To customize your Virtual Lobby, click on the Virtual lobby Editor and a menu with all the sections will appear on the left side of the screen. On the right side, you will have a Live view of your Virtual Lobby.

To begin your customization, click on Edit at the top right corner of the page.

When using a template other than the Normal template, the Virtual Lobby will not be customizable.
As you make changes to any section, the platform will highlight the section you are currently working on in real-time with a gridline, allowing you to see where your changes will be applied.
When making color customizations, you can select a color from the color board or type the hex color code or RGBA code of your desired color.

Sections

  1. Top Bar

Under this section, you will find the different customization options for the top bar of your Virtual Lobby.

  • Bar: Customize all the information on the top bar of your page, background color, font size, text color as well as hover color.
  • Buttons: Customize all the buttons on the top bar of your page, background color, font size, text color as well as hover color.
  • Left bar: Customize all the information on the left side of the top bar, background color, font size, text color as well as hover color.
  • Left bar buttons: Customize the buttons on the left side of the top bar, background colors, text color, font size, as well as hover color.
Left bar button customizations are visible within an activity, sponsor, or exhibitor room.
  • Right bar: Customize the background color of the right side of the top bar.
  • Right bar buttons: Customize the buttons on the right side of the top bar, background colors, text color, font size, as well as hover color.
GIF showing the Top Bar section of the Virtual Lobby Editor
  1. Vertical Bar

Under this section, you will find different customization options for the Vertical bar of your Virtual Lobby.

  • Bar: Change the vertical bar background color.
  • Menu Item: Change the text color, font size, hover background, and color of the menu items. You can also customize just one menu Item under the section Selected.
  • Icon: Change the style color, and hover color of the icons. You can also customize just one icon under the section Selected.
    GIF showing the Vertical Bar section of the Virtual Lobby Editor

Under this section, you will find different customization options for your Profile dropdown menu.

  • Info Profile: Here, you can customize the background color, text color, and font size of your profile information.
  • Menu Item: Here, you can change the background color, text color, and font size as well as the hover background color and hover text color of the menu items.
  • Menu Footer: Here you can change the footer color, text color, and font size as well as the hover background color and text color.
    GIF showing the Menu Dropdown section of the Virtual Lobby Editor
  1. Main Background

Under this section, you will be able to customize the left and right backgrounds separately or as a whole using color options, selected images or GIFs.

  • Main background: Here, you can upload a background image, use a background color or a GIF to personalize the whole background of your Virtual Lobby.
  • Left BG Virtual Lobby: Change the left background of your Virtual Lobby by uploading an image, a GIF or using a background color.
  • Right BG Virtual Lobby: Change the right background of your Virtual Lobby by uploading an image, a GIF or using a background color.
Suppose you previously had an image or a GIF as your background and want to replace it with a solid color. You must click on reset to clear the existing background image before setting a new one; otherwise, your changes might not reflect.
GIF showing the Main Background section of the Virtual Lobby Editor

  1. Event Cover

Under this section, you will find different customization options for your Event Title, text, feeds, etc

  • Event Title: Change your event title, text color, and font size.
  • Cover Content: Change your event cover's background color and control the opacity.
  • Event description: Change your event description's text color and font size.
  • News Feed: Change your Feed's opacity, background color, text color and font size.
    GIF showing the Event Cover section of the Virtual Lobby Editor
  1. Virtual Lobby

Under this section, you will be able to customize elements inside the Virtual Lobby.

  • Titles: Change titles' color, font size and hover color inside the Virtual Lobby (Activities, Sponsors, Group rooms, etc.).
  • Texts: Change text color and font size inside the Virtual Lobby(Activities, Sponsor, Networking, ground rooms, etc.)
  • Date Selectors: change the date color, font size, hover color, selecting color and text color for the dates of the activities
  • Searches: Change the search button background color, text color and font size.
  • Filter and Add Buttons: Change the filter background color, font size and hover color.
  • Activity Item: Change the activities border color
  • Meeting Item: Change the border color for Meetings
  • Sponsor Item: Change the border color for the Sponsors and Exhibitors.
  • Sponsor Content: Toggle sponsors and exhibitors on and off in the Virtual lobby.
  • Go Back link: Change the Go Back button color when inside the tabs.
    GIF showing the Virtual Lobby section of the Virtual Lobby Editor
  1. Live Session
    Under this section, you will find different customization options when inside activities, sponsor rooms, group rooms and breakout rooms.
  • Main Background: Change the background inside rooms, either by using customized colors or images.
  • Text Content: Change the text content colors in the background inside sessions.
  • Tabs: Change the background color for both left and right tabs inside sessions.
  • Tabs Icons: Change the tab icons' color, and hover color inside a session. You can customize the icons individually under the section Selected.
  • Tab Content: Change the background color of the tab's content inside a session.
  • Tab Content Titles: Change the content color and font size of the tab's titles inside a session.
  • Tab Content Texts: Change the content text colors inside the tabs of a session.
    GIF showing the Live Session section of the Virtual Lobby Editor
  1. Live Studio

Under this section, you will be able to customize various element properties in the Live Studio.

  • Label Name: Change the text shadow, color, border, padding, margin, letter case, and font properties of the Label Name.
  • Headline: Change the text shadow, color, border, padding, margin, letter case, and font properties of the Headline.
  • Chyron: Change the color, letter case, and font properties of the Chyron.
  • Default Lower third title: Change the color, border, padding, margin, letter case, and font properties of the Lower third subtitle.
  • Default Lower third subtitle: Change the color, border, padding, margin, letter case, and font properties of the Lower third subtitle.
  • Video: Change the border color and radius of the video.
    GIF showing the Live Studio section of the Virtual Lobby Editor
  1. General Pages

Under this section, you will be able to customize the other tabs' pages of your Virtual Lobby available in your event e.g My agenda, My files, My account, etc. To learn more about adding these tabs to your Virtual Lobby, click here.

  • Main Background: Change the Main background color of the general tabs' pages My Agenda, My account, My tickets, My files, Networking etc.
  • Titles: Change the color and font size of titles inside these pages such as My agenda, my account, etc.
  • Tabs: Change the background color, the text color, and the font size, for the tabs inside the general pages.
  • External Texts: Change the external text color for the general pages inside tabs such as (My Agenda, My tickets)
  • Date Selector: Change the text color and font size for dates on pages like My Agenda. You can also customize the background color and text color of specific dates under Selected.
    GIF showing the General Pages section of the Virtual Lobby Editor

Can I reset the Virtual Lobby customizations?

Yes, you can reset the customizations made on your Virtual Lobby individually by clicking on the Reset button, a pop-up will appear for your confirmation, click Reset to confirm.

You can also reset all customizations to the default Virtual Lobby settings at once by clicking on the Reset to default button at the upper right corner of the page.

Gif showing how to reset your Virtual Lobby to the default

Always click End to save changes.

Examples of Virtual Lobby customizations

Here are some examples of Virtual Lobby designs showing what you can achieve with the Virtual Lobby Editor tool.

  • Example 1:
    Example of Virtual Lobby design using the Virtual Lobby Editor tool

  • Example 2:
    Example of Virtual Lobby design using the Virtual Lobby tool

  • Example 3:
    Example of Virtual Lobby design using the Virtual Lobby

If you would like to know more about setting up your Virtual Lobby, consult this article Virtual Lobby.


How Did We Do?