OBS

OBS is a popular Free And Open Source streaming software, with advanced capacities for your live streams. In the current page, you will find some advices to handle your live chats using OBS.

OBS Overlay

You can easily include the chat in your stream.

Embeding the chat in a livestream

You can use the “チャットリンクを共有” feature to generate an URL to your chat. This button should be near the chat if you are the video owner (unless it was desactivated by your server admins).

Check the “読み取り専用にする” checkbox in the modal.

Share linkpopup

Then use this link as a “web browser source” in OBS.

Embeding the chat inOBS

You can use the “透過型背景にする (OBSなどを使用したストリーミング連携に最適)” option to have a transparent background in OBS. If you want to customize the background transparency, you can add this CSS in your OBS browser source’s settings:

:root {
  --livechat-transparent: rgba(255 255 255 / 90%) !important;
}

In the previous CSS snippet, you can of course change the color or the transparency, by adapting the color values.

Note: you can entirely customize chat colors. This is undocumented yet, but you can try this: in the modal, check «use curent theme colors», then you can try to manually change color values in the URL. You must use valid CSS color values, and they must be properly URL encoded.

Mixing multiple chats in your live stream

You can use the social_stream browser extension to mix multiple chat source (from Peertube, Twitch, Youtube, Facebook, …) and include their contents in your live stream. The compatibility with this plugin was added in recent versions.