Cómo poner el chat de Twitch en OBS

Para mostrar el chat en el stream, crea una URL de overlay de chat (por ejemplo, con nuestro overlay de chat de Twitch gratis) y, en OBS, haz clic en + debajo de Fuentes (Sources) → Navegador (Browser) y pégala. Para leer el chat dentro de OBS sin que lo vean los espectadores, conecta tu cuenta de Twitch en Ajustes → Emisión (Settings → Stream) para obtener un panel de chat, o añade tu chat emergente en Paneles → Paneles de navegador personalizados (Docks → Custom Browser Docks).

Elige el método adecuado

Método 1: overlay de chat transparente (recomendado)

Un overlay de chat es una página web hecha para streaming: fondo transparente, texto legible y nada más que los mensajes. Nuestro overlay de chat de Twitch es gratis, no requiere iniciar sesión, muestra emotes de 7TV, BTTV y FFZ, oculta bots y !comandos, y quita los mensajes que borran tus mods.

1. Abre la página del overlay de chat de Twitch y escribe el nombre de tu canal.
2. Elige un tema, una fuente y un tamaño. Burbujas (Bubbles) mantiene el texto legible sobre un gameplay recargado; 22–28 px va bien para 1080p.
3. Haz clic en Copiar para copiar la URL de tu overlay.
4. En OBS, selecciona tu escena, haz clic en + debajo de Fuentes → Navegador, ponle un nombre (por ejemplo “Chat”) y haz clic en Aceptar (OK).
5. Pega la URL en URL, pon Ancho (Width) en 400 y Alto (Height) en 600, y haz clic en Aceptar.
6. Arrastra la fuente a su sitio. Mantén pulsado Alt (Option en Mac) mientras arrastras un borde para recortar en lugar de escalar.

Deja el CSS personalizado (Custom CSS) predeterminado de la fuente de navegador. Hace que el fondo de la página sea transparente, así que solo aparecen los mensajes sobre tu escena.

Los servicios de alertas como StreamElements y Streamlabs también ofrecen widgets de chat que se añaden igual, con su URL de widget u overlay. Usa el que prefieras; solo necesitas uno.

Método 2: chat emergente de Twitch como fuente de navegador

El chat emergente (popout) de Twitch es una página de chat independiente en esta dirección (cambia yourchannel por tu nombre de usuario):

https://www.twitch.tv/popout/yourchannel/chat

1. Añade una fuente de Navegador como en el método 1 y pega la URL del chat emergente.
2. Ponle un tamaño, por ejemplo 400 × 600.
3. Recorta la cabecera y la caja de mensajes de abajo arrastrando con Alt.

Funciona, pero no está pensado como overlay: tiene el fondo sólido del chat de Twitch, la cabecera y la caja para escribir, y no muestra emotes de 7TV ni BTTV. El CSS personalizado predeterminado de OBS solo limpia el cuerpo de la página, no los paneles internos de Twitch. Puedes escribir CSS adicional para ocultar partes, pero los nombres de clase internos de Twitch cambian sin previo aviso, así que esas reglas se rompen. Un overlay dedicado da menos problemas.

Método 3: leer el chat en un panel dentro de OBS

Panel de chat de Twitch integrado

1. Abre Ajustes → Emisión y pon Servicio (Service) en Twitch.
2. Haz clic en Conectar cuenta (recomendado) (Connect Account (recommended)) e inicia sesión en Twitch en la ventana que se abre. Tu cuenta de Twitch necesita tener activada la autenticación en dos pasos; si no, OBS no puede obtener tu clave de transmisión.
3. Haz clic en Aceptar. OBS añade los paneles Chat, Stream Information, Twitch Stats y Twitch Activity Feed.
4. Arrastra el panel de chat donde quieras. Si lo cierras, recupéralo desde el menú Paneles (Docks).

El panel carga tu chat emergente con tu sesión iniciada, así que puedes escribir, usar las herramientas de moderación y verlo todo como en twitch.tv. En Ajustes → Emisión también puedes poner Twitch Chat Add-Ons en BetterTTV, FrankerFaceZ o ambos para cargar esas extensiones en ese panel. Nada de esto aparece en el stream.

Panel de navegador personalizado (sin conectar la cuenta)

1. En la barra de menús, haz clic en Paneles → Paneles de navegador personalizados.
2. Escribe un nombre del panel (Dock Name), como “Chat de Twitch”, y pega https://www.twitch.tv/popout/yourchannel/chat como URL.
3. Haz clic en Aplicar (Apply) y luego en Cerrar (Close). El panel se abre y puedes acoplarlo en cualquier parte de la ventana de OBS.

Los paneles personalizados son útiles si haces stream a un servidor personalizado (Custom) o para añadir el chat de un segundo canal. El mismo truco sirve para cualquier página web que quieras tener a la vista mientras haces stream, como tu feed de actividad de StreamElements o la vista de moderador de Twitch.

Consejos

• Pon el chat en una esquina que no use el HUD de tu juego. Consulta los tamaños de overlay para Twitch para ver las medidas del diseño.
• Usa la opción Ocultar después de (Hide after) del overlay (30–60 segundos) para que los mensajes antiguos no se queden en pantalla en los momentos tranquilos.
• ¿Quieres el mismo chat en un stream de YouTube o TikTok? El overlay es solo una fuente de navegador, así que muestra tu chat de Twitch dondequiera que hagas stream.
• Para bots y comandos en ese chat, consulta las guías de comandos de Nightbot y comandos del chat de Twitch.

Fuentes: OBS Knowledge Base: How do I add my chat to my stream? · OBS Knowledge Base: Browser Source · OBS Knowledge Base: Stream Layout Tutorial 2: Alerts & Chat Box · OBS Studio source: Twitch account integration (chat dock)