Кілька каналів і окремі оверлеї

1. Об’єднайте захоплення в одній сесії

Додайте потрібні чати джерел у SSN і переконайтеся, що по одному новому повідомленню з кожного надходить до того самого нефільтрованого дока Док чату трансляції. Залишайте цей док як операторський вигляд.

Копіюйте згенеровані посилання, щоб зберегти сесію, пароль, версію та налаштування сервера. Додавайте кожен вигляд для аудиторії як окреме браузерне джерело OBS. Давайте джерелам OBS зрозумілі назви, наприклад Чат Twitch і Чат YouTube.

2. Розділіть поточний чат за платформами

Для поточного чату створіть дві копії згенерованого URL дока dock.html . Додайте такі параметри до відповідних копій:

Наприклад, зі стандартним підключенням:

https://socialstream.ninja/dock.html?session=YOUR_SESSION_ID&onlyfrom=twitch&hidemenu

Використовуйте onlyfrom і hidefrom для цих сторінок. Не припускайте, що параметр на кшталт onlytype з іншого оверлею працює тут. Використовуйте youtubeshorts окремо, коли захоплення повідомляє цей тип. Див. Типи джерел.

3. Розділіть вибрані повідомлення

Для вибраного, а не поточного чату, продублюйте згенероване посилання featured.html й додайте &onlyfrom=twitch до однієї копії та &onlyfrom=youtube до іншої. Залишайте операторський док відкритим для вибору повідомлень.

Поточний параметр Featured Chat onlyfrom приймає один тип джерела. Не копіюйте наведений вище приклад дока з комами в це поле Featured Chat.

4. Два канали на одній платформі

onlyfrom=twitch вибирає Twitch як платформу, а не конкретний канал Twitch. Назви каналів і стрімів є метаданими, а не взаємозамінними назвами фільтрів URL. Додайте &showchannelname , щоб показувати назви каналів, коли джерело їх надає.

Для розширеної фільтрації дока &filtertid=123 приймає числовий ID вихідної вкладки; підтримуються ID через кому. Перегляньте справжні захоплені дані, щоб отримати їхній tid (дивіться Довідник подій і Команди й API). Не використовуйте тут ID каналу платформи. ID вкладок можуть змінюватися після повторного відкриття джерел, а джерела без відповідного ID вкладки можуть виключатися. Це параметр дока, а не загальний фільтр каналів Featured Chat.

Для повністю незалежних трансляцій використовуйте окремі екземпляри/профілі захоплення з різними сесіями й відкривайте в них лише потрібні джерела відповідної трансляції. Інша сесія для одного оверлею без відповідного захоплення залишить його без даних. Параметр оверлею label позначає сторінку для маршрутизації; це не фільтр каналів.

5. Перевірте кожен вигляд для аудиторії

1. Надішліть вигадане тестове повідомлення Twitch і вигадане тестове повідомлення YouTube в ізольовану сесію через Створюйте тестові повідомлення.
2. Переконайтеся, що обидва з’являються в операторському доку, а кожен оверлей поточного чату показує лише потрібне джерело.
3. Виберіть кожне повідомлення й перевірте кнопку очищення. Після перемикання платформ перевірте всі видимі сторінки вибраних повідомлень.
4. Повторіть зі справжнім повідомленням із кожного власного підключеного джерела, оскільки синтетичні повідомлення не можуть визначити фактичні ID вкладок джерел.

Якщо вигляд порожній, тимчасово приберіть його фільтр. Якщо чат повернеться, перевірте точний тип джерела або ID вкладки. Якщо він залишиться порожнім, використовуйте усунення несправностей сесії та маршрутизації. Зміна назви джерела OBS не оновлює його збережений URL.

6. Чат і сповіщення в одній вкладці браузера

Використовуйте Об’єднати оверлеї , щоб накласти наявні URL оверлеїв в одній вкладці або одному браузерному джерелі OBS. Це корисно для читання чату на телефоні під час IRL-стріму.

1. Вставте згенерований URL Streaming Chat Dock у нижній шар, а URL Multi-Stream Alert Box — у верхній. Збережіть сесію, пароль і параметри підключення в обох посиланнях.
2. Залиште Прозорий фон SSN увімкненим. Увімкніть «Дозволити натискання та прокручування на цьому шарі» для чату й вимкніть для сповіщень, щоб вони не блокували взаємодію з чатом.
3. Виберіть Попередній перегляд, потім Показати QR-код та відскануйте його камерою телефона. Або виберіть Скопіювати об’єднане посилання , щоб вставити результат у браузерне джерело. Об’єднаний вигляд не має елементів налаштування.

Можна додати до восьми URL і стрілками переміщувати шар позаду або попереду іншого. За замовчуванням шари заповнюють браузер. Розгорніть Розмір і положення на шарі, щоб задати його ширину, висоту, відступ зліва й зверху в пікселях (наприклад, 450) або у відсотках (наприклад, 100%). Порожні ширина й висота заповнюють браузер; порожні відступи починаються у верхньому лівому куті. Скинути до повного екрана очищає розміщення цього шару. Кожен оверлей зберігає власний вміст і налаштування.

Для лівого стовпця чату в браузерному джерелі OBS 1920×1080 установіть ширину шару чату 450, висоту — 1080, відступ зліва — 0, а відступ зверху — 0. Інші шари можуть залишатися повноекранними. Щоб Hype був над чатом, а Featured Chat зміщувався праворуч, використовуйте наведений нижче рецепт оформлення OBS. Розміри в пікселях залишаються сталими, коли розмір браузера змінюється; відсотки залежать від ширини чи висоти браузера.

Використовуйте посилання для редагування, щоб знову відкрити налаштування з уже заповненими URL і розміщенням. Щоб редагувати об’єднане посилання пізніше, додайте ?edit=1 перед його #.

Ваші посилання й параметри шарів автоматично зберігаються в цьому браузері, зокрема незавершені налаштування. Знову відкрийте Об’єднати оверлеї , щоб продовжити редагування, або виберіть Очистити збережені налаштування , щоб почати спочатку. У приватному перегляді сховище браузера може бути недоступним або тимчасовим.

Об’єднане посилання й QR-код містять повне оформлення та URL. Налаштуйте на комп’ютері, один раз відскануйте телефоном і додайте об’єднаний вигляд у закладки. Відкриття також зберігає налаштування в браузері телефона. Зміни на комп’ютері автоматично не оновлюють старе посилання: після редагування скопіюйте або відскануйте нове. Ця функція не синхронізує налаштування через ID сесії.

Тримайте об’єднані посилання й QR-коди в такій самій таємниці, як і окремі посилання оверлеїв. Захоплення SSN має й далі працювати, а телефон — мати доступ до серверів із початкових URL. Адреса localhost або 127.0.0.1 указує на пристрій, який відкриває посилання. Дуже довгі URL можуть перевищити місткість QR; об’єднане посилання все одно можна скопіювати.

Рецепт OBS: лівий стовпець чату з повноекранними ефектами

Для цього оформлення CSS не потрібен. Кожен шар — окрема область браузера. Установіть загальний розмір браузерного джерела OBS на 1920×1080, а потім використовуйте ці значення в розділі кожного шару Розмір і положення. Вводьте лише числа, без ком і «px». Додайте шари в такому порядку, починаючи з нижнього:

Перші 80 пікселів відведені для Hype, а під ним залишається стовпець чату завширшки 450 пікселів. Щоб чат займав усю висоту позаду Hype, установіть висоту Live Chat на 1080 і відступ зверху — 0. Для інших розмірів сцени потрібні інші значення в пікселях.

1. Вставте повні URL своїх оверлеїв. Скопіюйте їх із властивостей наявного браузерного джерела, зберігаючи сесію, пароль, стилі й налаштування підключення. Залиште Прозорий фон SSN увімкненим. Обрізання, перетворення, фільтри OBS і його поле Custom CSS не входять до URL та не переносяться.
2. Центруйте Hype у стовпці. У його hype.html URL, установіть align=center (замініть наявний align=left або align=right і приберіть alignright , якщо є). Для URL, який уже має ?session=..., додайте &align=center. Необов’язковий компактний початковий стиль — &combineall&hidetitle&style=compact&scale=0.75; замінюйте наявні значення, а не дублюйте їх. Збільште висоту шару Hype, якщо вибраному стилю потрібно більше місця.
3. Залишайте Featured Chat поза стовпцем чату. Установіть Left = 450 і Width = 1470 разом: 450 + 1470 = 1920. Зсув шару завширшки 1920 праворуч на 450 обрізав би його правий край. Featured Chat усе одно розміщує повідомлення внизу власної області. Щоб центрувати коротші повідомлення в цій області, додайте &center до його featured.html URL. Натомість для центрованих повідомлень по всій сцені використовуйте Left = 0, Width = 1920 і &center.
4. Залишайте NinjaBacker над Featured Chat. Вставте URL глядацького оверлею останнім шаром із наявним параметром анімації появи справа. Об’єднувач керує його областю та порядком шарів; оверлей NinjaBacker керує своєю анімацією та внутрішнім розміщенням. Його фон має бути прозорим, а сайт має дозволяти вбудовування. Цей необов’язковий шар не входив до перевірки прикладу з чотирма оверлеями.
5. Попередній перегляд у 1920×1080. Надішліть тестове повідомлення чату з емодзі, виберіть повідомлення в доку й увімкніть дані Hype в SSN. Сам звичайний чат не вибирає повідомлення Featured Chat. Якщо оверлей залишається порожнім, перевірте його окрему роботу.
6. Скопіюйте нове об’єднане посилання в OBS. Установіть для самого браузерного джерела Width 1920 і Height 1080. Розмір попереднього перегляду об’єднувача не задає розміри OBS. Упишіть нове джерело в сцену без обрізання. Після кожної зміни оформлення знову копіюйте нове об’єднане посилання; старе посилання OBS зберігатиме старе оформлення.

Продуктивність: одне браузерне джерело все одно запускає кожен вбудований оверлей і його підключення. Об’єднання зменшує кількість джерел OBS, але не гарантує меншого використання CPU чи пам’яті. Завершивши, закрийте попередній перегляд у браузері та порівняйте продуктивність OBS із вимкненими старими джерелами. Продуктивність M1 macOS/OBS і ваш конкретний URL NinjaBacker усе ще потрібно перевірити на вашій системі. Можна залишити Live Chat окремо й об’єднати лише інші оверлеї, якщо так краще.

Якщо шар порожній або закриває чат

• Спочатку відкрийте кожен початковий URL окремо. Сповіщення зазвичай порожні до надходження події; об’єднання сторінок не захоплює нових подій.
• Автоматична прозорість підтримує dock.html, featured.html, multi-alerts.html, і minecraft.html. Іншим сторінкам потрібні власні налаштування прозорого фону. Деякі зовнішні сайти взагалі блокують вбудовування.
• Прозорий шар усе одно може блокувати натискання. Вимкніть Дозволити натискання та прокручування на будь-якому шарі над чатом, якому не потрібна взаємодія.
• Мобільні браузери можуть вимагати взаємодії зі сторінкою перед відтворенням звуку. За потреби ввімкніть взаємодію для цього шару й натисніть його; обмеження автовідтворення браузера все одно діють. Перевірте звук на справжньому телефоні, перш ніж покладатися на нього.