Folia OBS浏览器源教程直播中如何显示全屏歌词【免费下载链接】folia-major专注于绚丽的歌词动画效果的本地音乐/navidrome/第三方多平台在线音乐播放器项目地址: https://gitcode.com/GitHub_Trending/fo/folia-majorFolia是一款专注于绚丽歌词动画效果的本地音乐 / Navidrome / 第三方多平台在线音乐播放器。本文将教你用 Folia 内置的OBS 浏览器源功能在直播画面中免费显示全屏歌词动画——只渲染动画、不播放音频观众看到的歌词始终和你的播放进度实时同步。什么是 Folia 的 OBS 浏览器源Folia 内置了一个只读的 OBS 歌词渲染页面入口为/obs它会实时同步跟随 Folia 主播放时钟逐行滚动歌词无需任何手动操作静音渲染只输出画面不会把音频推给 OBS⚡性能优化OBS 连接后主窗口自动停止渲染重动画把性能让给直播端支持自定义资产上传的背景图 / 立绘 / 头像等可以一并带入 OBS 画面渲染核心代码位于 ObsBrowserSourceApp.tsx它会自动把画面按 1920×1080 的基准布局并在高分辨率下保持文字清晰。第一步在 Folia 中开启 OBS 浏览器源打开 Folia进入设置 → 集成OBS 浏览器源分区打开「启用 OBS 浏览器源」开关界面上会显示一个OBS 地址本地 URL点击复制即可旁边的连接数指示灯绿色表示 OBS 已连上红色表示未连接该开关的说明原文见 zh-CN.ts在 OBS 中渲染完整歌词动画且不播放音频。连接后主窗口会停止渲染重动画。设置面板的实现代码见 IntegrationSettingsSubview.tsx开启、复制地址、重新生成令牌等操作都集中在这里。第二步在 OBS 中添加浏览器源打开 OBS Studio在来源面板点击→ 选择浏览器在类型中选择自定义 URL粘贴上一步复制的 Folia OBS 地址建议参数新手最快配置方法参数推荐值说明宽度1920Folia 按 1920×1080 基准布局高度1080横版直播最常用比例刷新率60fps 间隔刷新歌词动画更顺滑关闭标签页时停止渲染勾选节省资源点击确定。OBS 里出现 Folia 歌词动画、且 Folia 中「连接数」变绿就说明成功了 ✅进阶全屏歌词与透明叠加两种玩法玩法 A全屏歌词背景直接把浏览器源铺满整个直播画面观众看到的就是纯歌词动画。Folia 会为 OBS 端单独做布局适配无需额外设置。玩法 B透明窗口叠加如果你希望歌词浮在摄像头、游戏画面之上开启「透明播放器背景」选项见 zh-CN.ts仅对播放页生效。开启后会切换到透明窗口模式适合 OBS 浏览器源或抠像叠加场景。在 OBS 中把该浏览器源调小、拖到你喜欢的位置即可背景全透明。想让自定义背景 / 立绘也进直播间如果你的视觉设置里上传了自定义背景、立绘、头像等资产仅复制 URL 是不够的——Folia 提供了「复制 OBS CSS」按钮点击复制 OBS 链接再点击复制 OBS CSS把 CSS 粘贴到 OBS 浏览器源 →自定义 CSS框与链接配套使用否则 OBS 端会回退到默认素材。这两枚按钮实现在 ObsCopyUrlButton.tsx 与 ObsCopyCssButton.tsx。常见问题排查现象解决办法连接数一直是 0 / 红色确认 Folia 正在运行且已开启 OBS 浏览器源地址必须是本地回环地址不能外网访问OBS 里是空白页面重新复制一次完整地址注意带 token 参数检查浏览器源宽高等于 1920×1080自定义背景没生效记得同时粘贴复制 OBS CSS的内容到自定义 CSS 框链接突然失效点击「重新生成令牌」更新地址后再同步到 OBS想要 OBS 里主题固定不变使用静态主题模式把当前主题「烧」进链接OBS 中永远固定 小提示Folia 还支持Now Playing 信息源与PlayerCap 源见 ObsNowPlayingSourceApp.tsx可以在直播间同步显示「正在播放」卡片和歌词源搭配使用效果更佳。写在最后整个过程只需要Folia 里开开关 → OBS 里加浏览器源 → 粘贴地址三步即可让直播间拥有一块实时滚动、随歌跳动的全屏歌词屏。项目更多架构细节可参考官方文档 CODEMAP.md歌词渲染页面说明见 src/README.md。快去试试吧让你的直播弹幕和歌词一起「唱」起来 【免费下载链接】folia-major专注于绚丽的歌词动画效果的本地音乐/navidrome/第三方多平台在线音乐播放器项目地址: https://gitcode.com/GitHub_Trending/fo/folia-major创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Folia OBS浏览器源教程：直播中如何显示全屏歌词
Folia OBS浏览器源教程直播中如何显示全屏歌词【免费下载链接】folia-major专注于绚丽的歌词动画效果的本地音乐/navidrome/第三方多平台在线音乐播放器项目地址: https://gitcode.com/GitHub_Trending/fo/folia-majorFolia是一款专注于绚丽歌词动画效果的本地音乐 / Navidrome / 第三方多平台在线音乐播放器。本文将教你用 Folia 内置的OBS 浏览器源功能在直播画面中免费显示全屏歌词动画——只渲染动画、不播放音频观众看到的歌词始终和你的播放进度实时同步。什么是 Folia 的 OBS 浏览器源Folia 内置了一个只读的 OBS 歌词渲染页面入口为/obs它会实时同步跟随 Folia 主播放时钟逐行滚动歌词无需任何手动操作静音渲染只输出画面不会把音频推给 OBS⚡性能优化OBS 连接后主窗口自动停止渲染重动画把性能让给直播端支持自定义资产上传的背景图 / 立绘 / 头像等可以一并带入 OBS 画面渲染核心代码位于 ObsBrowserSourceApp.tsx它会自动把画面按 1920×1080 的基准布局并在高分辨率下保持文字清晰。第一步在 Folia 中开启 OBS 浏览器源打开 Folia进入设置 → 集成OBS 浏览器源分区打开「启用 OBS 浏览器源」开关界面上会显示一个OBS 地址本地 URL点击复制即可旁边的连接数指示灯绿色表示 OBS 已连上红色表示未连接该开关的说明原文见 zh-CN.ts在 OBS 中渲染完整歌词动画且不播放音频。连接后主窗口会停止渲染重动画。设置面板的实现代码见 IntegrationSettingsSubview.tsx开启、复制地址、重新生成令牌等操作都集中在这里。第二步在 OBS 中添加浏览器源打开 OBS Studio在来源面板点击→ 选择浏览器在类型中选择自定义 URL粘贴上一步复制的 Folia OBS 地址建议参数新手最快配置方法参数推荐值说明宽度1920Folia 按 1920×1080 基准布局高度1080横版直播最常用比例刷新率60fps 间隔刷新歌词动画更顺滑关闭标签页时停止渲染勾选节省资源点击确定。OBS 里出现 Folia 歌词动画、且 Folia 中「连接数」变绿就说明成功了 ✅进阶全屏歌词与透明叠加两种玩法玩法 A全屏歌词背景直接把浏览器源铺满整个直播画面观众看到的就是纯歌词动画。Folia 会为 OBS 端单独做布局适配无需额外设置。玩法 B透明窗口叠加如果你希望歌词浮在摄像头、游戏画面之上开启「透明播放器背景」选项见 zh-CN.ts仅对播放页生效。开启后会切换到透明窗口模式适合 OBS 浏览器源或抠像叠加场景。在 OBS 中把该浏览器源调小、拖到你喜欢的位置即可背景全透明。想让自定义背景 / 立绘也进直播间如果你的视觉设置里上传了自定义背景、立绘、头像等资产仅复制 URL 是不够的——Folia 提供了「复制 OBS CSS」按钮点击复制 OBS 链接再点击复制 OBS CSS把 CSS 粘贴到 OBS 浏览器源 →自定义 CSS框与链接配套使用否则 OBS 端会回退到默认素材。这两枚按钮实现在 ObsCopyUrlButton.tsx 与 ObsCopyCssButton.tsx。常见问题排查现象解决办法连接数一直是 0 / 红色确认 Folia 正在运行且已开启 OBS 浏览器源地址必须是本地回环地址不能外网访问OBS 里是空白页面重新复制一次完整地址注意带 token 参数检查浏览器源宽高等于 1920×1080自定义背景没生效记得同时粘贴复制 OBS CSS的内容到自定义 CSS 框链接突然失效点击「重新生成令牌」更新地址后再同步到 OBS想要 OBS 里主题固定不变使用静态主题模式把当前主题「烧」进链接OBS 中永远固定 小提示Folia 还支持Now Playing 信息源与PlayerCap 源见 ObsNowPlayingSourceApp.tsx可以在直播间同步显示「正在播放」卡片和歌词源搭配使用效果更佳。写在最后整个过程只需要Folia 里开开关 → OBS 里加浏览器源 → 粘贴地址三步即可让直播间拥有一块实时滚动、随歌跳动的全屏歌词屏。项目更多架构细节可参考官方文档 CODEMAP.md歌词渲染页面说明见 src/README.md。快去试试吧让你的直播弹幕和歌词一起「唱」起来 【免费下载链接】folia-major专注于绚丽的歌词动画效果的本地音乐/navidrome/第三方多平台在线音乐播放器项目地址: https://gitcode.com/GitHub_Trending/fo/folia-major创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考