Bilibili-Old：让经典B站界面重现的完整指南

Bilibili-Old：让经典B站界面重现的完整指南

【免费下载链接】Bilibili-Old 恢复旧版Bilibili页面，为了那些念旧的人。 项目地址: https://gitcode.com/gh_mirrors/bi/Bilibili-Old

你是否也对B站新版界面感到陌生？复杂的布局、繁多的推荐和不断变化的交互逻辑，是否让你怀念那个简洁纯粹的旧版B站？Bilibili-Old开源项目正是为解决这一痛点而生，它能帮助你轻松恢复熟悉的B站经典界面，让浏览体验回到那个充满回忆的时代。本文将为你提供从部署到个性化配置的全方位指南，无论你是技术新手还是进阶用户，都能找到适合自己的方案。

一、为什么需要Bilibili-Old？界面变迁的痛点解析

随着B站的不断发展，界面设计也在持续变化。新版界面虽然功能更丰富，但也带来了一些问题：

• 信息过载：首页推荐内容过多，难以快速找到自己感兴趣的视频
• 操作复杂：播放器控件位置和功能布局不断调整，熟悉的操作方式不再适用
• 视觉疲劳：明亮的色调和频繁的动画效果，长时间使用容易产生视觉疲劳
• 功能冗余：许多不常用的功能占据了宝贵的屏幕空间

Bilibili-Old通过精心设计的界面还原方案，解决了这些问题，让B站回归简洁高效的本质。

二、部署路径选择：哪种方案适合你？

根据你的技术背景和使用习惯，Bilibili-Old提供了两种部署方案，你可以根据以下决策指南选择最适合自己的方式：

方案一：浏览器扩展版（推荐新手用户）

这种方案安装简单，功能稳定，适合大多数用户：

1. 获取项目文件：打开终端，执行以下命令克隆项目仓库

   git clone https://gitcode.com/gh_mirrors/bi/Bilibili-Old
   

2. 准备扩展文件：进入项目目录，找到chrome文件夹，这就是我们需要的扩展程序文件

3. 安装扩展程序：

   • 打开Chrome浏览器，在地址栏输入chrome://extensions/并回车
   • 开启右上角的"开发者模式"开关
   • 点击"加载已解压的扩展程序"按钮
   • 选择之前找到的chrome文件夹

[!TIP] 安装完成后，浏览器工具栏会出现Bilibili-Old的图标（如以下图片所示），点击即可访问设置界面。

方案二：用户脚本版（适合进阶用户）

如果你已经在使用Tampermonkey等脚本管理器，这个方案会更加适合你：

1. 安装脚本管理器：如果尚未安装，请先在浏览器中安装Tampermonkey插件

2. 导入用户脚本：

   • 打开项目中的tampermonkey/main.user.js文件
   • 将其内容复制到剪贴板
   • 在Tampermonkey中创建新脚本，粘贴内容并保存

3. 启用脚本：在Tampermonkey管理界面中找到Bilibili-Old脚本，确保其处于启用状态

[!TIP] 用户脚本（可自定义网页行为的代码片段）方式的优势在于可以更灵活地与其他脚本配合使用，但需要定期手动更新。

三、核心功能配置：打造你的专属B站体验

播放器经典布局恢复

旧版播放器是很多用户最怀念的部分，Bilibili-Old提供了完整的经典播放器还原：

痛点解析：新版播放器控件布局分散，操作区域不集中，影响观看体验。

解决方案：

• 核心逻辑位于：[src/core/player.ts]
• 新手推荐值：默认配置即可获得经典播放器体验
• 进阶配置：可修改播放器控制栏布局、进度条样式和快捷键设置

弹幕系统优化

经典弹幕体验是B站的特色之一，Bilibili-Old让弹幕回归最初的样子：

痛点解析：新版弹幕显示区域不合理，字体大小和滚动速度缺乏个性化选项。

解决方案：

• 核心逻辑位于：[src/core/danmaku.ts]
• 新手推荐值：启用"经典弹幕样式"选项
• 进阶配置：可调整弹幕字体大小、透明度、滚动速度和显示区域比例

导航与页面结构调整

B站旧版的导航结构更加清晰，内容分类明确：

痛点解析：新版导航菜单层级复杂，常用功能需要多次点击才能访问。

解决方案：

• 核心逻辑位于：[src/page/]目录中的各个页面模块
• 新手推荐值：启用"经典导航栏"选项
• 进阶配置：可自定义导航菜单顺序，添加常用功能快捷入口

四、拓展技巧：个性化你的B站体验

主题颜色自定义

Bilibili-Old允许你根据个人喜好调整界面颜色：

• 核心逻辑位于：[src/css/]目录下的样式文件
• 新手推荐值：选择"经典蓝"主题
• 进阶配置：修改CSS变量自定义颜色方案，打造专属视觉风格

快捷键操作增强

提高浏览效率的关键是善用快捷键：

• 核心逻辑位于：[src/core/accesskey.ts]
• 新手推荐值：使用默认快捷键方案
• 进阶配置：自定义常用操作的快捷键，如播放/暂停、音量调节、全屏切换等

下载功能优化

Bilibili-Old提供了更便捷的视频下载功能：

• 核心逻辑位于：[src/core/download.ts]
• 新手推荐值：使用默认下载设置
• 进阶配置：可调整下载画质、格式和保存路径，支持批量下载

五、常见问题解决：让你的Bilibili-Old始终保持最佳状态

安装后界面无变化怎么办？

1. 清除浏览器缓存（快捷键Ctrl+Shift+Delete）
2. 重启浏览器并确认扩展/脚本已启用
3. 检查页面加载监控：[src/core/observer.ts]

弹幕显示异常处理

1. 检查弹幕配置是否正确
2. 尝试重置弹幕设置
3. 查看网络请求状态：[src/core/network-mock.ts]

功能失效应对方案

1. 确保使用的是最新版本
2. 检查B站页面是否有重大更新
3. 查看相关功能模块：[src/core/]目录下的对应文件

六、总结：重拾经典，提升体验

Bilibili-Old不仅仅是一个界面还原工具，它是对更简洁、更高效的网络浏览体验的回归。通过本文介绍的部署方案和配置技巧，你可以轻松打造属于自己的经典B站界面。无论是为了找回青春记忆，还是追求更专注的视频观看体验，Bilibili-Old都能满足你的需求。

现在就动手尝试，让那个充满回忆的B站重新回到你的浏览器中吧！

【免费下载链接】Bilibili-Old 恢复旧版Bilibili页面，为了那些念旧的人。 项目地址: https://gitcode.com/gh_mirrors/bi/Bilibili-Old