If you have been a BigBlueButton administrator for a while, and have used Greenlight as the front-end to access BigBlueButton, you most likely want to change the default landing page of the Greenlight.

Typically changes that we have seen being asked are:

  1. How to replace default BBB logo by my own logo
  2. How to change some text, or
  3. How to complete change the landing page with my own text, images and layout

Well, if that sounds like you, read on.

Here is a step-by-step process to change Greenlight landing page:

  1. Clone the Greenlight : git clone https://github.com/bigbluebutton/greenlight.git
  2. Open app/views/main/index.html.erb
  3. This is a ruby on rails  html.erb file, You need to not worry about that. You can use regular html. We have included a sample index.html.erb that you can use as a reference.
  4. Once you change the index.html.erb you need to create a new docker image. To create a new docker image please follow the below steps.
    – Create new docker image: docker build -t <new image name> <Dockerfile path>
    Note: Dockerfile path: <greenlight path>/Dockerfile
  5. Once the image is created reference this image in docker-compose.yml
    Change image: bigbluebutton/greenlight:v2 to image:<new image name>
  6. Finally restart the Greenlight: docker-compose down && docker-compose up -d
Sample index.html.erb
<div class="background">
 <div class="container pt-9 pb-8">
   <div class="row">
     <div class="col-md-12 col-sm-12 text-center">
       <h1 id="main-text" class="display-4 mb-6">Welcome to my cool meeting. </h1>
     </div>
   </div>
 </div>
</div>
<!-- If you want to remove “Greenlight Features” section, Delete the below line -–>
<%= render "main/components/features" %>

Do you want to know what all you can customize in Greenlight?

Header-over to our website and create a trial account (free) on a customized Greenlight. You would notice a handful of customizations including:

  1. A different landing page
  2. A different Signup page – a new field for mobile number (including country flags!)
  3. Additional tabs for new features – streaming and monitoring, and
  4. Subscription, which is a Stripe integration

Does any of these customizations interest you? Feel free to schedule a call to talk more.