[How to] How to customize meeting options

Picking up at

Hi damencho,

saw recently the new beta version (https://beta.meet.jit.si/), and installed it on a Digital Ocean droplet.
How can I customize the welcome text (Jitsi Meet - Secure and high quality meetings)?
I got a look into the known config.js files, but I did not find the text.

Any idea?

Regards, ATH

AFAIK one way to do this is adding CSS declarations in “body.html” found in /usr/share/jitsi-meet. (“body.html” is normally empty. It may be overwritten during upgrades, so keeping a copy of a customized file is a good idea.)

<style>
.welcome .header .header-text-title {
    font-size: 0;
}
.header-text-title::before {
    content: "** Your custom text goes here **";
    font-size: 2.4rem;  
}
</style>

Of course more elaborate styles could be included but this simple approach works for my uncomplicated needs.

2 Likes

Live safer… no doubt.

Question though how do I disable the screen sharing on the desktop? config.desktopSharingSources=false
Does not seem to do it.

Thanks
H

Hey, @corby good article! Very useful!

But I think it’s not fully correct in part that /etc/jitsi/meet/[your-domain-name]-config.js in honored by mobile app.
I add disableTileView: true, option and web clients open only MainView (and even TileView button don’t work at all) but mobile client connects with TileView
Checked on version 20.6.2 on Jitsi Meet on Android.

UPD. Version 21.0.0 works perfect and connect in MainView. I believe version before 21.0.0 don’t have support of disableTileView option in codebase.

Great news!

When I using JWT token in the meeting url, how to set it?

https://test.com/testmeeting#config.startWithVideoMuted=true&interfaceConfig.TOOLBAR_BUTTONS=["microphone"%2C"camera"%2C"desktop"%2C"fullscreen"%2C"hangup"%2C"profile"%2C"settings"%2C"videoquality"]&interfaceConfig.SETTINGS_SECTIONS=["devices"%2C"language"]&interfaceConfig.TOOLBAR_ALWAYS_VISIBLE=true**&jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJjb250ZXh0Ijp7InVzZXIiOnsiZW1haWwiOiJjb21jaGF0QHMzMzMuY29tIn19LCJpc3MiOiJqaXRzaSIsImF1ZCI6ImppdHNpIiwic3ViIjoiKiIsInJvb20iOiIqIiwibW9kZXJhdG9yIjp0cnVlLCJleHAiOjE3MzQ1NjU0MzJ9.75uPcmv3JbgUdlVwbUJpJRTlkEG6Z9yGcx0xkUw_fPY**

https://test.com/testmeeting&jwt=hdhdhdd#config.someconfig=true

Thank you for your quick reply.

It works!
https://test.com/testmeeting?jwt=hdhdhdd#config.someconfig=true

As of the March 2021 release, interface_config.js options are deprecated. These have been moved into config.js .

Is this already implemented in the code or is it just planned?
If it is already implemented, could someone provide an example on how to set interfaceConfig.* Parameters in config.js?

I tried something like:
interfaceConfig.DISABLE_FOCUS_INDICATOR = true;
in config.js but it didnt work?

Any hints on this would be highly appreciated! :slight_smile:

Dear All,
I would like to customize a meeting so that participants will use the possibly least resource / bandwidth.
I wonder whether setting disableSimulcast to true can do the job?
If simulcast is not available, participant will send only one stream to JVB, relaying to other participants. In such situation, which resolution will participant send to JVB ? From the config.js I see we can specify config.resolution for preferred resolution, then there are constraints.video.height.ideal/max/min for ideal / max and min case. So which one will be used in the non simulcast mode ?
Also from the config.js, I find the videoQuality.minHeightForQualityLv1.NNN:low/standard/high and startBitrate. Can you share some documents to combine these settings to have a meaningful configuration please?
I guess that I can fix a resolution say 240 (height in pixels) with a predefined quality like low / standard or high for a given Bitrate ? But the predefined quality is already determined by a bitrate ? For instance I dont think we can have a high quality with say 100kbps bitrate.
So I just get messed up with these params. Please help me to set correctly
Many thanks

Summary

This text will be hidden

i can’t find file location of config.js, in my instance only found interface_config.js. what should i do? i want to hide or disable some option menu on android like recording, live streaming, etc

what should i do ?

thanks in advance

Hey, I just had a look at the jitsi config.js file for the various options that are currently supported. I did not see More actions menu in the toolbar options array. Is it not provided yet.
PS, I am currently passing the config through url.
Any help would be highly appreciated.

Thanks!

From interface_config.js:

* Notes:
     * - it's impossible to choose which buttons go in the "More actions" menu
     * - it's impossible to control the placement of buttons

“More actions” is a menu item that houses buttons, it is not a button itself.

1 Like

The name of the toolbar buttons to display in the toolbar, including the “More actions” menu
Line 507, config.js

Please elaborate a bit on this line.
Also, Is there a particular criteria for the visibility of more actions menu. Like >= a particular number of buttons must be present, etc.

The problem I am facing is on mobile devices only. When testing the UI on dev console, the menu is clearly visible but not when the app is actually opened in a mobile phone.

Thanks!

The visibility of the “More actions” menu is influence by the window width as well as the number enabled icons.

Thresholds are determined by the following constant:

The order array above determines max number of icons to show before “More Actions” is used. For example, if width is > 520ps, then 7 max icons will be show with the listed actions taking priority. If one of the listed icons is disabled, then another icon will be included at the end to fill up the 7th slot.

If width is between 320-370, then only 3 icons will be shown with everything else in “More Actions”, and so on.

1 Like

This does bring some clarity. Although, in our app I can currently see 5 icons (microphone, camera, chat, recording, select-background on a mobile phone. It falls in the category of 320 - 370px. But there’s no sign of the More actions menu. Also, I have included the screen share button as well in the config toolbar, but that doesn’t show up in mobile devices.
Thanks for the insights though!

Thanks for the extensive post! I only wish I had found it earlier in my Jitsi journey.

The documentation at IFrame API · Jitsi Meet Handbook points you to the config.js and interface_config.js files to learn about the various configuration options.

However, it took me quite a while of trial and error plus code reviews to discover two important facts (that are not mentioned in the above Handbook pages):

  1. The interface_config.js has been deprecated.
  2. Only “whitelisted” items are accessible via the API.

I started with the public meet.jit.si and then moved onto the JaaS offering so it took me awhile to figure out the configuration. I suspect these two learnings are probably more obvious to those leveraging a Docker deployment.

Hopefully, someone sees this suggestion and makes a small, but hugely helpful, update to the docs :-).

Hi @damencho Could you help me with this? Is there a way to show only "Your entire screen" tab and not others?