Как сделать окно чата прозрачным

Обновлено: 28.04.2024

Как вывести чат на стрим OBS на Твиче? Этим вопросом задаются как профессиональные, так и новоиспеченные игроки. Непонимание начинается в тот момент, когда требуется обнародовать чат в трансляции ОБС Студио на площадке Ютуб или Твич. Мы составили пошаговую инструкцию с объяснениями по этому вопросу.

Как добавить чат на стрим OBS Twitch

Здесь есть два канала — TwoRatChat и OBS Studio. Практичнее всего для чата на экране использовать специализированную программу, однако, не все они одинаково полезны. Кроме того, бесплатных и эффективных осталось мало. Почти все требуют плату за использование. Описанные ниже варианты позволяют избежать трудностей с дополнительными софтами.

TwoRatChat

Такие действия позволят отображать окно текстового взаимодействия поверх ячейки игры. Внимание! Беседа отображается при том условии, если игра запущена в оконном режиме. Если же она не владеет таким свойством, то потребуется второй монитор.

OBS Studio

Через софт ОБС Студио также возможно вывести вверх иконку чата. Для этого:

запускаем программу;
нажимаем по полю источников правой кнопкой мыши для вызова контекстного меню;
переходим в параметр «Добавить»;
кликаем на «Изображение»;
жмем кнопку «Обзор»;
выбираем нужное изображение;
выбираете месторасположение чата.

Существует еще один способ, как сделать чат на стриме OBS на Твич.

В разделе инструментов TwoRatChat выделяем пункт «Включить локальный сервер».
Скопируйте ссылку в буфер обмена.
В ОБС открываем раздел добавить и переходим в «Браузер».
Там, где требуется указать действующий «Адрес URL» вставляем ссылку из буфера обмена.
Осуществите редактирование параметров изображения.

Как настроить чат в ОБС для Твича

Чтобы вывести чат для Твича на экран эфира, существует много программ и разрешений, но наибольшей популярностью пользуется TwoRatChat. Как уже упоминалось, следует перейти в параметры и вывести в активное положение опции «Поверх всех окон» и «Сохранять чат как картинку».

Внимание! Включите функцию локального сервера в TwoRatChat, чтобы он работал в режиме онлайн. Для синхронизации с OBS Studio добавьте источник в подгруппе «Браузер».

Команды чата на Твиче

Общение в беседе между зрителями и стримером во время видео — очень важно для рейтинга, продвижения и удобного использования. Чтобы облегчить этот процесс, разработчики создали немалое количество команд. Вот самые популярные из них:

Кликните правой кнопкой мыши по окну и выберите из контекстного меню соответствующую позицию.

Как сделать чат на Твиче только для фолловеров

Выставляя параметры беседы, сделайте ее закрытой для всех пользователей, но доступной для подписчиков.

Нажмите на «шестеренку» внизу чата и выберите пункт «Только для фолловеров».
В новом окне настройте время отслеживания через которое подписчики могут начать общаться в чате.

Делаем прозрачный чат

Редактировать тему диалога возможно в настройках графики.

Как объединить чат Твича и Ютуба

Нажмите правой кнопкой мыши по окну и выберите из контекстного меню соответствующую позицию. Также синхронизацию возможно настроить в параметрах эфира на Youtube.

Что делать, если пропал чат Twitch

Первое, что нужно сделать — перезапустить окна. Выйдите с браузера или приложения, и повторно выполните вход. В таком случае диалоговое окно потребуется настроить заново.

Установка и настройка чата для стрима поверх игры и на экране трансляции

Всем привет! Всем стримерам нужно следить за чатом на стриме. Это не сложно когда у вас два монитора. Но что делать тем у кого один монитор?

Я сам пользуюсь лишь одним монитором. Второй не хочу приобретать, так как хочу в будущем купить второй ПК вместе уже с монитором и использовать его чисто для стрима, но сейчас не об этом.

Программы для чата на стриме

В посте я расскажу о двух программах, при помощи которых вы сможете видеть чат во время игры, а также установить его на экран трансляции, чтобы зрители могли читать чат не отвлекаясь от стрима.

Настройки программы, к сожалению на английском, но в них не так сложно разобраться. Стрим каналы добавляются в панели настроек (Dashboard) на сайте.

Можно также вывести чат на экран стрима и настроить его: прозрачность, размер шрифта, иконки, черный список, фильтр запрещенных слов и ссылок.

Данную программа я приобрел, чтобы следить одновременно за чатом Твича (Twitch) и ГудГейма (GoodGame). Также мне нравится, что их бот (RutonyBot) может оповещать о новых подписчиках и донат, различное оформление чата на экране для стрима, просмотр чата поверх игры.

Есть большое НО. Если вы стримите с двух ПК, то не советую ее приобретать RutonyChat через Steam, так как она не будет работать.

Если интересно на какой компьютере (PC) я веду стримы, то вам сюда. Ну а если хотите задать вопрос на прямую, то вам на мой канал zakrut TV .

Кстати, есть отличный сервис для оповещения доната с выводом без комиссии – Donatepay .

Так как предыдущий способ, описанный здесь, уже не работает воспользуемся новым и подключим наш чат при помощи бесплатной программы TwoRatChat для этого скачиваем программу по ссылке: Яндекс диск

После скачивания архива распаковываем его в папку, папку называем, например, названием самой программы TwoRatChat

В папке ищем файл TwoRatChat.Main, кликаем по нему 2 раза, если вы всё сделали верно запустится окно программы.

TwoRatChat

Далее действуем по инструкции:

Выполнив 4й пункт позволит нам отображать чат по верх игры, но помните чат отображается только если игра запущена в оконном режиме, если игра не имеет данной опции для того чтобы читать чат во время игры вам потребуется 2й монитор.

Детальная настройка не вызовет у Вас трудностей программа на русском языке стоит упомянуть только как именно производить визуальную настройку программы:

Как убрать чат на Твиче на телефоне или ПК? Если вы задались этим вопросом, значит вам точно нужен этот обзор. Переписка на Twitch — это основной инструмент коммуникации между подписчиками и геймером во время трансляции прямого эфира на канале. С помощью нее возможно передавать важную информацию, распространять рекламу и анонсы, общаться, комментировать, задавать вопросы и отвечать на них. Но когда потребность в этом пропадает, а диалоговое окно отвлекает, его необходимо убрать.

Как отключить чат в Твиче на телефоне

Любая деактивация диалогового окна возможна при помощи команд. Если ваш Android или Айфон поддерживает приложение Twitch, то авторизуйтесь в нем и перейдите в переписку. Там администрирование выполняется посредством нажатия на шестеренку в углу, и применением следующих действий:

выбор цвета — позволяет изменить дизайн диалогового окна;
отметки времени — слева от СМС отображается точное время отправки;
затемненный режим — обновление интерфейса переписки в новой цветовой гамме;
скрыть чат — убрать полностью окно;
открыть в отдельном окне — дублировать вкладку диалога в другом окне;
значки модераторов — расположены левее от ника юзера, рядом с ними — временный и вечный бан;
Slow-мод;
очистить чат — полностью удалить всю историю общения геймера и подписчиков.

Если через телефон вы хотите убрать беседу из видимости, воспользуйтесь нашей инструкцией:

Убираем чат через компьютер во время стрима

Далее поговорим о том, как отключить чат на Твиче с ПК. Операция не составит труда даже игроку, который в системе первый день. Для вывода диалога на экран во время просмотра стрима в 2022 существует множеством дополнительных программ. Наиболее надежной по техническим параметрам является TwoRatChat.

Так беседа будет активирована поверх ячейки игры. Чтобы ее убрать:

кликаем правой кнопкой мыши по окну программы;
наш выбор — строка «Добавить источник чата»;
убираете там ссылку;
сохраняете изменения.

Если в настройках игры вы убрали канал общения, то и на Youtube или OBS передаваться он не будет.

Как добавить чат на стрим OBS Twitch

TwoRatChat

OBS Studio

Через софт ОБС Студио также возможно вывести вверх иконку чата. Для этого:

Существует еще один способ, как сделать чат на стриме OBS на Твич.

Как настроить чат в ОБС для Твича

Внимание! Включите функцию локального сервера в TwoRatChat, чтобы он работал в режиме онлайн. Для синхронизации с OBS Studio добавьте источник в подгруппе «Браузер».

Команды чата на Твиче

Как отвечать в чате Twitch

Кликните правой кнопкой мыши по окну и выберите из контекстного меню соответствующую позицию.

Как сделать чат на Твиче только для фолловеров

Выставляя параметры беседы, сделайте ее закрытой для всех пользователей, но доступной для подписчиков.

Делаем прозрачный чат

Редактировать тему диалога возможно в настройках графики.

Как объединить чат Твича и Ютуба

Что делать, если пропал чат Twitch

Как сделать красивый чат YouTube на стриме в OBS Studio. Без левых программ и плагинов

Краткое содержание

Чат на стриме пример.jpg (46.04 КБ) 219272 просмотра Чат на стриме пример.jpg (46.04 КБ) 219272 просмотра

Открыть чат в новом окне.jpg (25.97 КБ) 219272 просмотра Открыть чат в новом окне.jpg (25.97 КБ) 219272 просмотра

И так, мы получили ссылку на чат с трансляции YouTube через команду "Открыть чат в новом окне", скопировали стиль CSS с сайта-генератора (или можете попробовать мой, он находится ниже), вставляем все это в свойства BrowserSource:

Настройки источника.jpg (26.91 КБ) 219272 просмотра Настройки источника.jpg (26.91 КБ) 219272 просмотра

OBS постоянно писала какую-то информация на диск, создавая излишнюю и абсолютно ненужную нагрузку на компьютер. Но мне удалось избежать этого, заменив вид ссылки на обычный локальный:

SheepChat на стриме.jpg (50.47 КБ) 219272 просмотра SheepChat на стриме.jpg (50.47 КБ) 219272 просмотра

В общем, мне пока хватает этих двух способов, надеюсь и вам пригодится. Мой стиль CSS для ютуба, который я использую, вы можете скопировать чуть ниже. А если у вас есть еще какие-нибудь интересные методы, не поленитесь и поделитесь со мной в комментариях. Удачных стримов!
V V

Так как YouTube постоянно у себя в системе что-то меняет, приходится менять и стиль, удаляя ненужные элементы. Например появились дурацкие подсветки под ником админа, вдруг вылезла полоса прокрутки и кто знает, что еще ждет нас в будущем. Вот моя текущая таблица стилей, а старую убрал чуть ниже под спойлер.

@import url("https://fonts.googleapis.com/css?family=Ubuntu Condensed");
@import url("https://fonts.googleapis.com/css?family=Ubuntu");
@import url("https://fonts.googleapis.com/css?family=Imprima");

/* Background colors*/
body background-color: rgba(0,0,0,0);
overflow: hidden;
>
yt-live-chat-text-message-renderer background-color: rgba(0,0,0,0.7) !important;
>

yt-live-chat-text-message-renderer[author-type="owner"] background-color: rgba(100,0,0,0.7) !important;
>

yt-live-chat-text-message-renderer[author-type="moderator"] background-color: rgba(0,0,100,0.7) !important;
>

/* Transparent background. */
yt-live-chat-renderer background-color: transparent !important;
>

/* Hide header and input. */
yt-live-chat-header-renderer,
yt-live-chat-viewer-engagement-message-renderer,
yt-live-chat-message-input-renderer display: none !important;
>

/* Reduce side padding. */
yt-live-chat-text-message-renderer,
yt-live-chat-legacy-paid-message-renderer padding-left: 4px !important;
padding-right: 4px !important;
margin: 4px 0 !important;
>

width: 32px !important;
height: 32px !important;
border-radius: 32px !important;
margin-right: 8px !important;
>

vertical-align: text-top !important;
>

yt-live-chat-paid-message-renderer margin: 4px 0 !important;
>

yt-live-chat-text-message-renderer a,
yt-live-chat-legacy-paid-message-renderer a text-decoration: none !important;
>

yt-live-chat-text-message-renderer[is-deleted],
yt-live-chat-legacy-paid-message-renderer[is-deleted] display: none !important;
>

yt-live-chat-ticker-renderer background-color: transparent !important;
box-shadow: none !important;
>
yt-live-chat-ticker-renderer display: none !important;
>

yt-live-chat-text-message-renderer,
yt-live-chat-legacy-paid-message-renderer animation: anim 200ms;
animation-fill-mode: both;
>

yt-live-chat-text-message-renderer,
yt-live-chat-legacy-paid-message-renderer animation: anim 30400ms;
animation-fill-mode: both;
>

@import url("https://fonts.googleapis.com/css?family=Ubuntu Condensed");
@import url("https://fonts.googleapis.com/css?family=Ubuntu");
@import url("https://fonts.googleapis.com/css?family=Imprima");

/* Background colors*/
body background-color: rgba(0,0,0,0);
>
yt-live-chat-text-message-renderer background-color: rgba(0,0,0,0.7) !important;
>

yt-live-chat-text-message-renderer[author-type="owner"] background-color: rgba(100,0,0,0.7) !important;
>

yt-live-chat-text-message-renderer[author-type="moderator"] background-color: rgba(0,0,100,0.7) !important;
>

/* Transparent background. */
yt-live-chat-renderer background-color: transparent !important;
>

/* Hide header and input. */
yt-live-chat-header-renderer,
yt-live-chat-message-input-renderer display: none !important;
>

/* Reduce side padding. */
yt-live-chat-text-message-renderer,
yt-live-chat-legacy-paid-message-renderer padding-left: 4px !important;
padding-right: 4px !important;
margin: 4px 0 !important;
>

width: 32px !important;
height: 32px !important;
border-radius: 32px !important;
margin-right: 8px !important;
>

vertical-align: text-top !important;
>

yt-live-chat-paid-message-renderer margin: 4px 0 !important;
>

yt-live-chat-text-message-renderer a,
yt-live-chat-legacy-paid-message-renderer a text-decoration: none !important;
>

yt-live-chat-text-message-renderer[is-deleted],
yt-live-chat-legacy-paid-message-renderer[is-deleted] display: none !important;
>

yt-live-chat-ticker-renderer background-color: transparent !important;
box-shadow: none !important;
>
yt-live-chat-ticker-renderer display: none !important;
>

yt-live-chat-text-message-renderer,
yt-live-chat-legacy-paid-message-renderer animation: anim 200ms;
animation-fill-mode: both;
>

yt-live-chat-text-message-renderer,
yt-live-chat-legacy-paid-message-renderer animation: anim 30400ms;
animation-fill-mode: both;
>

Шаг 1: Получение ссылки

Откройте Творческую студию YouTube, используя кнопку выше.
Нажмите иконку сигнала (при наведении курсора подписывается словами «Начать трансляцию»), чтобы перейти к параметрам проведения эфира.

Шаг 2: Оформление

«Fonts»

«Messages»

«Channel Names»

Важно! Если случайно перезагрузить страницу, все установленные параметры будут сброшены. Если планируется детально настроить все опции отображения, время от времени создавайте резервные копии, просто копируя стили в текстовый документ.

Шаг 3: Добавление

Заключительный этап — добавление чата в OBS.

«Источники»

«+»

Способ 2: Twitch

Решение задачи вывода чата в эфир, проводимый на площадке Twitch, подробно рассмотрено в общей статье о настройке OBS для стриминга на нашем веб-сайте.

Мы рады, что смогли помочь Вам в решении проблемы.

Отблагодарите автора, поделитесь статьей в социальных сетях.

Опишите, что у вас не получилось. Наши специалисты постараются ответить максимально быстро.

Читайте также: