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:
- How to replace default BBB logo by my own logo
- How to change some text, or
- 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:
- Clone the Greenlight : git clone https://github.com/bigbluebutton/greenlight.git
- Open app/views/main/index.html.erb
- 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.
- 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
- Once the image is created reference this image in
docker-compose.yml
– Change image:bigbluebutton/greenlight:v2 to image:<new image name>
- 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:
- A different landing page
- A different Signup page – a new field for mobile number (including country flags!)
- Additional tabs for new features – streaming and monitoring, and
- Subscription, which is a Stripe integration
Does any of these customizations interest you? Feel free to schedule a call to talk more.