This will all probably be changed back if you upgrade the app and this isn’t the completely correct way to customize the application but here’s what I did.
Login page background color or image using CSS:
File Location: /usr/share/jitsi-meet/css/all.css
Search for “body.welcome-page”
To change the background gradient color:
- Open the all.css file and search for “body.welcome-page”
- find: background-image:linear-gradient(-90deg,#1251AE 0,#0074FF 50%,#1251AE 100%);
- change the gradient colors as needed.
Note:
Original: linear-gradient(-90deg,#1251AE 0,#0074FF 50%,#1251AE 100%)
Blue: linear-gradient(-90deg,#163e7a 0,#082654 50%,#021736 100%);
To replace the gradient with a background image:
- Upload an image to /usr/share/jitsi-meet (background.jpg in this example)
- Edit /usr/share/jitsi-meet/css/all.css
- Find these lines (in bold the line that we’re going to change):
body.welcome-page{
background:inherit;
overflow:auto
}
.welcome{
background-image:linear-gradient(-90deg,#1251AE 0,#0074FF 50%,#1251AE 100%);
display:flex;
and change that line to:
background-image: url(’/background.jpg’);
background-position:center;
background-repeat:none;
background-size:cover;
Login page text:
/usr/share/jitsi-meet/libs/app.bundle.min.js
as a root or sudo user
Search for the content you want to replace.
You can just search for “Secure, fully” you will see it with other content as on the screen.
You do the same thing to change description in the same file by searching for something like “Go ahead” you will see other text.
Made your modification, save and preview in browser.
Note Chrome might still be showing the same thing as previous, so you will need to clear cache to see the change in chrome browser.
Login Page Logo
Replace /usr/share/jitsi-meet/images/watermark.png with new image.