Social Stream Ninja（SSN）可以把 YouTube、Twitch、TikTok 等 120+ 平台的聊天统一到一个浏览器源里。要使用 Doodlekuma 的 Social Stream 版本 CSS，你需要让 OBS 加载 SSN 的 Main chat overlay & control dock，并把 CSS 粘贴到那里——而不是 YouTube 原生弹出聊天室。
官方站点：socialstream.ninja
📺 更喜欢看视频？ 在 YouTube 搜索 “Social Stream Ninja”，或从这两个开始：
你需要准备
- OBS Studio（或 Streamlabs OBS）。
- 按官方说明完成初始设置的 Social Stream Ninja。
- 一个已接入 SSN 的聊天平台，例如 YouTube Live。
- 从 Doodlekuma 直播弹幕样式库 下载的 Social Stream 版本 CSS。
先分清 Social Stream 与 YouTube 两个版本
Doodlekuma 的主题通常提供两种 CSS：
- Social Stream：用于 SSN 的 Main chat overlay & control dock（本教程使用）。它是功能更丰富的 overlay，CSS 能覆盖更多消息类型。
- YouTube：用于 YouTube 原生弹出聊天室（
yt-live-chat-…DOM）。
两者的 DOM 结构不同，不能混用。下面的步骤请下载 Social Stream 版本。
第一步：从 Social Stream Ninja 复制 overlay 链接
- 打开 Social Stream Ninja，进入 Sources and Settings。添加你的平台（例如你的 YouTube 频道），让真实消息开始进来。
- 在右侧面板顶部找到 Main chat overlay & control dock——这是功能更丰富的 overlay，也是 Doodlekuma CSS 针对的对象。
- 用右上角的 [copy link] 按钮复制它的链接，形如
https://socialstream.ninja/dock.html?session=XXXXXXXX。
先把这个链接留着，下一步 OBS 就是加载它。
第二步：在 OBS 添加浏览器源并粘贴 CSS
- 在 OBS 的 来源（Sources） 点击 +，选择 浏览器（Browser）。
- 把第一步的 Social Stream Ninja URL 粘贴到 URL 字段。
- 宽度设为
1920、高度设为1080（或与你的直播布局一致）。 - 把 Doodlekuma 的 Social Stream CSS 粘贴到 Custom CSS 框里。
- 点击 OK。你的弹幕样式现在就渲染在这个浏览器源上了。
去哪里拿 CSS
打开 Doodlekuma 直播弹幕样式库，选一个主题，下载时选择 Social Stream 版本。打开 .css 文件复制全部内容，粘贴到第二步的 OBS Custom CSS 框里。在主题自定义器里调参后，重新下载即可。
常见问题
样式不生效
先确认你下载的是 Social Stream 版本，并且 OBS 的 URL 是 SSN 的 dock.html（Main chat overlay & control dock）——不是 YouTube 的 live_chat 链接。
完全不显示
在加 CSS 之前，先确认 Social Stream Ninja 里已经能看到真实消息。先接消息源，再谈样式——排查会简单很多。
消息 DOM 和 YouTube 不一样
这是正常的。Social Stream Ninja 与 YouTube 原生聊天室的 DOM 结构不同，所以两种 CSS 文件必须分开。
更多 Social Stream Ninja 资源
- 官方站点：socialstream.ninja
- Creating custom chat overlays for Social Stream Ninja
- How to Set Up Social Stream Ninja (Standalone App) — Full Step-by-Step Guide
- 或在 YouTube 搜索 Social Stream Ninja 获取更多讲解。