Projekte - Twitch BubbleChat Overlay

Dieses Chat-Overlay sorgt für eine ansprechende Darstellung im Sprechblasendesign von Chatnachrichten in Echtzeit. Zudem werden Emotes von Twitch (Globale und vom Channel), BTTV, 7TV und FFZ vollständig unterstützt, sofern vom Streamenden bei den Anbietern eingerichtet, sodass die gesamte Bandbreite an Community-Emotes nahtlos integriert ist.

Beispielbilder

Chat Overlay mit Beispielnachrichten
Chat Overlay mit Beispielnachrichten

Einrichtung

Es gibt zwei Möglichkeiten. Man kann entweder die GitHub-URL als OBS Browser Source einfügen oder die drei Dateien (chat.html, javascript.js und comfy.min.js) in einen Ordner herunterladen und die lokale chat.html einbinden. In beiden Fällen muss bei der URL der Channelname hinzugefügt werden.

  1. Overlay einrichten:
    • GitHub-URL zum Einbinden: https://zakoom.github.io/twitchtools-bubblechat/chat.html?channelname=%channelname%
    • Es gibt auch optionale Parameter:
        • clientid und authtoken: Diese sind Pflicht, wenn man Emotes verwenden möchte. Wenn die Client-ID oder der AuthToken unbekannt ist, kann man sie online generieren, zum Beispiel hier (Zum GitHub Repo)
        use_bttv: Dieser Parameter wird auf 1 gesetzt, wenn die konfigurierten Emotes von BTTV angezeigt werden sollen.
        use_7tv: Dieser Parameter wird auf 1 gesetzt, wenn die konfigurierten Emotes von 7TV angezeigt werden sollen.
        use_ffz: Dieser Parameter wird auf 1 gesetzt, wenn die konfigurierten Emotes von FFZ angezeigt werden sollen.
        fontfamily: Um eine andere Schriftart zu setzen. Der Standard ist Comic Sans MS, Arial.
        ignoreuser: Um Nachrichten eines Users nicht anzuzeigen
    • Wenn alles verwendet werden soll, mit Beispielsweise dem Channelnamen zakoom, der Client-ID 123456789, dem AuthToken abcdef7890, der Schriftart Verdana und Nachrichten von Nightbot nicht sichtbar sind, ist hier ein Beispiel:
      GitHub-URL zum Einbinden: https://zakoom.github.io/twitchtools-bubblechat/chat.html?channelname=zakoom&clientid=123456789&authtoken=abcdef7890&use_bttv=1&use_7tv=1&use_ffz=1&fontfamily=Verdana&ignoreuser=nightbot

Download

Lade hier die aktuellste twitchtools-bubblechat.zip herunter, um das Chat Overlay zu verwenden:

Auf GitHub