1. Erfassung in einer Sitzung zusammenführen
Füge die gewünschten Quellchats in SSN hinzu und prüfe, ob je eine neue Nachricht im selben ungefilterten Streaming-Chat-Dock ankommt. Behalte dieses Dock als Bedienansicht.
Kopiere erzeugte Links, damit Sitzung, Passwort, Version und Servereinstellungen erhalten bleiben. Füge jede Zuschaueransicht als eigene OBS-Browserquelle hinzu. Gib OBS-Quellen aussagekräftige Namen wie Twitch-Chat und YouTube-Chat.
- Erfassen Twitch + YouTube
- Eine SSN-Sitzung Bedien-Dock sieht beide
- OBS-Ansichten Nur Twitch und nur YouTube
2. Laufenden Chat nach Plattform aufteilen
Erstelle für laufenden Chat zwei Kopien deiner erzeugten dock.html URL. Hänge diese Optionen an die jeweiligen Kopien an:
| Zuschaueransicht | An die Dock-URL anhängen |
|---|---|
| Twitch-Chat |
&onlyfrom=twitch&hidemenu
|
| YouTube-Chat |
&onlyfrom=youtube&hidemenu
|
| Twitch und YouTube zusammen |
&onlyfrom=twitch,youtube&hidemenu
|
| Alles außer Discord |
&hidefrom=discord&hidemenu
|
Zum Beispiel bei einer Standardverbindung:
https://socialstream.ninja/dock.html?session=YOUR_SESSION_ID&onlyfrom=twitch&hidemenu
Verwende onlyfrom und hidefrom für diese Seiten. Gehe nicht davon aus, dass eine Option wie onlytype aus einem anderen Overlay hier funktioniert. Verwende youtubeshorts separat, wenn die Erfassung diesen Typ meldet. Siehe Quelltypen.
3. Ausgewählte Nachrichten aufteilen
Dupliziere für ausgewählte statt laufende Chatnachrichten deinen erzeugten Link für featured.html und füge &onlyfrom=twitch zu einer Kopie und &onlyfrom=youtube zur anderen hinzu. Lass das Bedien-Dock geöffnet, um Nachrichten auszuwählen.
Die aktuelle Featured-Chat-Option onlyfrom akzeptiert einen Quelltyp. Das obige kommagetrennte Dock-Beispiel sollte nicht in dieses Featured-Chat-Feld kopiert werden.
4. Zwei Kanäle auf derselben Plattform
onlyfrom=twitch wählt Twitch als Plattform, keinen bestimmten Twitch-Kanal. Kanalnamen und Streamtitel sind Metadaten und keine austauschbaren URL-Filternamen. Füge &showchannelname hinzu, um Kanalnamen anzuzeigen, sofern die Quelle sie liefert.
Für erweiterte Dock-Filterung &filtertid=123 akzeptiert die numerische ID des Ursprungstabs; kommagetrennte IDs werden unterstützt. Prüfe tatsächlich erfasste Nutzdaten und ermittle deren tid (siehe Ereignisreferenz und Befehle und API). Verwende hier keine Plattform-Kanal-ID. Tab-IDs können sich beim erneuten Öffnen von Quellen ändern, und Quellen ohne passende Tab-ID können ausgeschlossen werden. Dies ist eine Dock-Option, kein allgemeiner Kanalfilter für Featured Chat.
Verwende für vollständig unabhängige Produktionen getrennte Erfassungsinstanzen/Profile mit unterschiedlichen Sitzungen und öffne dort nur die jeweiligen gewünschten Quellen. Eine andere Sitzung für ein Overlay ohne passende Erfassung lässt es inaktiv. Der Parameter label kennzeichnet eine Seite für das Routing; er ist kein Kanalfilter.
5. Jede Zuschaueransicht prüfen
- Sende eine erfundene Twitch- und eine erfundene YouTube-Testnachricht in eine isolierte Sitzung mit Testnachrichten erstellen.
- Prüfe, ob beide im Bedien-Dock erscheinen und jedes laufende Chat-Overlay nur seine vorgesehene Quelle zeigt.
- Hebe jede Nachricht hervor und teste die Schaltfläche zum Leeren. Prüfe nach einem Plattformwechsel alle sichtbaren Featured-Seiten.
- Wiederhole dies mit einer echten Nachricht aus jeder deiner verbundenen Quellen, da künstliche Nachrichten keine tatsächlichen Quell-Tab-IDs bestimmen können.
Wenn eine Ansicht leer ist, entferne ihren Filter vorübergehend. Kommt Chat zurück, prüfe den genauen Quelltyp oder die Tab-ID. Bleibt sie leer, verwende Fehlerbehebung für Sitzung und Routing. Das Umbenennen einer OBS-Quelle aktualisiert ihre gespeicherte URL nicht.
6. Chat und Meldungen in einem Browser-Tab
Verwende Overlays kombinieren um bestehende Overlay-URLs in einem Tab oder einer OBS-Browserquelle übereinanderzulegen. Das ist nützlich, wenn du während eines IRL-Streams Chat auf dem Handy liest.
- Füge die erzeugte Streaming-Chat-Dock-URL in die unterste und die Multi-Stream-Alert-Box-URL in die oberste Ebene ein. Behalte Sitzung, Passwort und Verbindungsoptionen in beiden Links.
- Lass Transparenter SSN-Hintergrund aktiviert. Aktiviere „Tippen und Scrollen auf dieser Ebene erlauben“ für den Chat und deaktiviere die Option für Benachrichtigungen, damit sie die Chat-Interaktion nicht blockieren.
- Auswählen Vorschau, dann QR-Code anzeigen und scanne ihn mit der Handykamera. Oder wähle Kombinierten Link kopieren um das Ergebnis in eine Browserquelle einzufügen. Die kombinierte Ansicht enthält keine Einrichtungsfelder.
Du kannst bis zu acht URLs hinzufügen und eine Ebene mit den Pfeilschaltflächen hinter oder vor eine andere verschieben. Ebenen füllen standardmäßig den Browser. Klappe Größe und Position bei einer Ebene auf, um Breite, Höhe, linken und oberen Abstand in Pixeln festzulegen (zum Beispiel 450) oder Prozentwerten (zum Beispiel 100%). Leere Breite und Höhe füllen den Browser; leere Abstände beginnen oben links. Auf Vollbild zurücksetzen setzt die Positionierung dieser Ebene zurück. Jedes Overlay behält seinen Inhalt und seine Einstellungen.
Für eine linke Chatspalte in einer OBS-Browserquelle mit 1920×1080 setze die Breite der Chatebene auf 450, Höhe auf 1080, links auf 0, und oben auf 0. Andere Ebenen können im Vollbild bleiben. Für Hype über dem Chat und Featured Chat nach rechts verschoben verwende das OBS-Layoutbeispiel unten. Pixelgrößen bleiben bei geänderter Browsergröße fest; Prozentwerte folgen der Breite oder Höhe des Browsers.
Verwende den bearbeitbaren Link, um die Einrichtung mit ausgefüllten URLs und Positionen wieder zu öffnen. Füge zum späteren Bearbeiten eines kombinierten Links ?edit=1 vor diesem Teil der URL ein: #.
Deine Links und Ebenenoptionen werden automatisch in diesem Browser gespeichert, auch unfertige Einrichtungen. Öffne Overlays kombinieren um weiterzubearbeiten, oder wähle Gespeicherte Einrichtung löschen um neu zu beginnen. Im privaten Browsermodus kann Browserspeicher fehlen oder vorübergehend sein.
Kombinierter Link und QR-Code enthalten das vollständige Layout und die URLs. Richte alles am Desktop ein, scanne einmal auf dem Handy und speichere die kombinierte Ansicht als Lesezeichen. Beim Öffnen wird diese Einrichtung auch im Handy-Browser gespeichert. Desktop-Änderungen aktualisieren einen älteren Link nicht automatisch: Kopiere oder scanne nach dem Bearbeiten den neuen Link. Diese Funktion synchronisiert Einstellungen nicht über deine Sitzungs-ID.
Behandle kombinierte Links und QR-Codes genauso privat wie einzelne Overlay-Links. Die SSN-Erfassung muss weiterhin laufen, und das Handy muss die Server der ursprünglichen URLs erreichen können. Eine localhost oder 127.0.0.1 Adresse verweist auf das Gerät, das den Link öffnet. Sehr lange URLs können die QR-Kapazität überschreiten; der kombinierte Link lässt sich weiterhin kopieren.
OBS-Beispiel: linke Chatspalte mit Vollbildeffekten
Für dieses Layout brauchst du kein CSS. Jede Ebene ist ein eigener Browserbereich. Setze die gesamte OBS-Browserquelle auf 1920×1080, und verwende dann diese Werte unter den jeweiligen Ebenenoptionen Größe und Position. Gib nur Zahlen ein, ohne Kommas oder „px“. Füge die Ebenen in dieser Reihenfolge hinzu, die unterste zuerst:
| Ebene | Breite | Höhe | Links | Oben |
|---|---|---|---|---|
| 1. Livechat / Dock | 450 | 1000 | 0 | 80 |
| 2. Hype-Zähler | 450 | 80 | 0 | 0 |
| 3. Emoji-/Emote-Wand | 1920 | 1080 | 0 | 0 |
| 4. Hervorgehobener Chat | 1470 | 1080 | 450 | 0 |
| 5. NinjaBacker (optional) | 1920 | 1080 | 0 | 0 |
Die ersten 80 Pixel sind für Hype reserviert, darunter bleibt eine 450 Pixel breite Chatspalte. Soll Chat stattdessen die volle Höhe hinter Hype belegen, setze die Livechat-Höhe auf 1080 und oben auf 0. Andere Szenengrößen benötigen andere Pixelwerte.
- Füge deine vollständigen Overlay-URLs ein. Kopiere sie aus den Eigenschaften deiner bestehenden Browserquellen und behalte Sitzung, Passwort, Stile und Verbindungseinstellungen. Lass Transparenter SSN-Hintergrund aktiviert. OBS-Zuschnitt, Transformationen, Filter und das Feld Benutzerdefiniertes CSS sind nicht Teil der URL und werden nicht übertragen.
- Hype innerhalb der Spalte zentrieren. Setze in der URL von
hype.htmldie Optionalign=center(ersetze ein vorhandenesalign=leftoderalign=right, und entfernealignrightfalls vorhanden). Bei einer URL, die bereits?session=...enthält, hänge&align=centeran. Ein optionaler kompakter Ausgangsstil ist&combineall&hidetitle&style=compact&scale=0.75; ersetze vorhandene Werte, statt sie zu duplizieren. Erhöhe die Hype-Ebenenhöhe, wenn der gewählte Stil mehr Platz benötigt. - Featured Chat außerhalb der Chatspalte halten. Setze Links = 450 und Breite = 1470 gemeinsam: 450 + 1470 = 1920. Eine 1920 Pixel breite Ebene um 450 nach rechts zu verschieben würde ihren rechten Rand abschneiden. Featured Chat platziert die Nachricht weiterhin nahe dem unteren Rand des eigenen Bereichs. Füge zum Zentrieren kürzerer Nachrichten innerhalb dieses Bereichs
¢erzu seinerfeatured.htmlURL hinzu. Für zentrierte Nachrichten über die gesamte Szene verwende stattdessen Links = 0, Breite = 1920 und¢er. - NinjaBacker über Featured Chat halten. Füge die Zuschauer-Overlay-URL als letzte Ebene mit ihrer bestehenden Animation von rechts ein. Der Kombinierer steuert Bereich und Ebenenreihenfolge; das NinjaBacker-Overlay steuert Animation und interne Platzierung. Sein Hintergrund muss transparent sein und seine Website Einbettung erlauben. Diese optionale Ebene war nicht Teil des Beispiels mit vier getesteten Overlays.
- Vorschau mit 1920×1080. Sende eine Test-Chatnachricht mit Emojis, hebe eine Nachricht aus deinem Dock hervor und aktiviere Hype-Daten in SSN. Normaler Chat allein wählt keine Featured-Chat-Nachricht. Prüfe jedes Overlay einzeln, wenn es leer bleibt.
- Kopiere den neuen kombinierten Link in OBS. Setze die eigene Breite dieser Browserquelle auf 1920 und die Höhe auf 1080. Die Vorschaugröße des Kombinierers legt die OBS-Maße nicht fest. Passe die neue Quelle ohne Zuschnitt an deine Szene an. Kopiere nach jeder Layoutänderung den neuen kombinierten Link erneut; ein älterer OBS-Link behält sein altes Layout.
Leistung: Eine Browserquelle führt weiterhin jedes eingebettete Overlay und dessen Verbindungen aus. Kombinieren reduziert die Anzahl der OBS-Quellen, garantiert aber keinen geringeren CPU- oder Speicherverbrauch. Schließe die Browservorschau anschließend und vergleiche die OBS-Leistung bei deaktivierten alten Quellen. Die Leistung unter M1-macOS/OBS und deine konkrete NinjaBacker-URL müssen noch auf deinem System geprüft werden. Du kannst Livechat getrennt lassen und nur die anderen Overlays kombinieren, wenn das besser funktioniert.
Wenn eine Ebene leer ist oder Chat verdeckt
- Öffne zuerst jede ursprüngliche URL einzeln. Meldungsseiten bleiben normalerweise leer, bis ein Ereignis ankommt; das Kombinieren von Seiten erfasst keine neuen Ereignisse.
- Automatische Transparenz unterstützt
dock.html,featured.html,multi-alerts.html, undminecraft.html. Andere Seiten benötigen eigene Einstellungen für transparente Hintergründe. Manche externe Websites blockieren Einbettungen vollständig. - Eine transparente Ebene kann Berührungen weiterhin blockieren. Deaktiviere Tippen und Scrollen zulassen auf jeder Ebene über dem Chat, die keine Interaktion benötigt.
- Mobile Browser erfordern möglicherweise eine Interaktion mit einer Seite, bevor sie Ton abspielen. Aktiviere bei Bedarf die Interaktion für diese Ebene und tippe darauf; Browserbeschränkungen für automatische Wiedergabe gelten weiterhin. Prüfe Audio auf dem tatsächlichen Handy, bevor du dich darauf verlässt.