侧边栏分类整理器

[Drew-ART (Drew)]

我制作了一个侧边栏组织器。之前对此有很多讨论，其他人觉得它没有必要，但我一直觉得我的用户不太懂技术，或者一开始对论坛的工作方式了解不够，所以我制作了这个下拉式组织器来提供帮助。

顶部有一个小切换按钮，用户可以在两者之间切换并选择他们喜欢的任何一个。

侧边栏分类组织器

一个 Discourse 主题组件，用于将侧边栏分类组织到具有高级功能的、可自定义的、带颜色编码的部分中。

特性

• 10 个可折叠部分: 将分类分组到最多 10 个自定义部分中
• 颜色自定义: 为每个部分标题设置背景色和文本颜色
• 渐变背景: 像照片中那样的可选渐变淡入效果
• 分类徽章: 类别旁边的默认 Discourse 彩色徽章可以切换开启/关闭
• 子分类支持: 每个部分的切换按钮，用于显示/隐藏子分类（缩进显示）
• 分类隐藏: 从所有视图中隐藏特定分类
• 双向切换: 在自定义部分和默认 Discourse 视图之间切换（切换按钮会出现在两个视图中）
• 持久化状态: 记住哪些部分是打开/关闭的，以及用户的视图偏好
• 权限感知: 只显示用户有权访问的分类
• 未分组分类: 自动将任何未分类的分类显示在单独的部分中
• 移动响应: 适用于所有设备尺寸

安装

1. 在您的 Discourse 实例中，转到 Admin → Customize → Themes
2. 点击 Install → From a Git repository
3. 输入：https://github.com/focallocal/sidebar-categories-organizer
4. 点击 Install
5. 将组件添加到您的活动主题中

配置

全局设置

• 启用侧边栏组织器 (Enable Sidebar Organizer): 开启/关闭自定义视图
• 显示切换按钮 (Show Toggle Button): 显示 图标以在视图之间切换（出现在自定义视图和默认视图的标题中）
• 显示分类徽章 (Show Category Badges): 在类别名称旁边显示彩色方块
• 使用渐变淡入 (Use Gradient Fade): 在部分标题上启用渐变背景效果（50% 实色，50% 淡出至透明）
• 要隐藏的分类 (Categories to Hide): 逗号分隔的分类 slug，用于从所有视图中隐藏（例如：staff,private）
• 默认视图 (Default View): 选择默认加载哪个视图（自定义或默认）

部分设置 (1-10)

每个部分都有：

• 启用 (Enabled): 切换部分开启/关闭
• 标题 (Title): 部分标题文本
• 背景颜色 (Background Color): 部分标题背景的颜色选择器
• 文本颜色 (Text Color): 标题文本的颜色选择器
• 分类 (Categories): 逗号分隔的分类 slug（例如：general,support,feedback）
• 显示子分类 (Show Subcategories): 切换显示/隐藏此部分的子分类
• 默认展开 (Default Open): 部分是默认展开还是折叠

查找分类 Slug

分类 slug 位于 URL 中：

• yoursite.com/c/general/5 → slug 是 general
• yoursite.com/c/feature-requests/12 → slug 是 feature-requests

用法

安装并配置后：

1. 自定义视图: 分类将按您配置的部分分组，并带有彩色标题
2. 展开/折叠: 点击部分标题可切换内容的可见性
3. 切换视图: 点击标题中的 图标可在自定义视图和默认视图之间切换
   • 在自定义视图中：切换按钮出现在自定义视图标题中
   • 在默认视图中：切换按钮出现在默认的“Categories”标题中
4. 子分类: 当在每个部分启用时，子分类会缩进显示在父分类下方
5. 分类徽章: 小彩色方块（如果启用）显示每个分类的颜色
6. 未分组分类: 任何未分配给部分的分类都将显示在“Other Categories”中
7. 偏好设置: 您的视图选择和打开/关闭状态会为每个浏览器保存

高级特性

渐变背景

启用时，部分标题使用平滑的渐变：

• 50% 实色（您选择的背景色）
• 50% 淡出至透明
• 营造出现代、时尚的外观

分类隐藏

指定分类 slug 以完全从侧边栏中隐藏：

• 适用于仅限工作人员或已弃用的分类
• 适用于自定义视图和默认视图
• 逗号分隔列表（例如：staff,private,archived）

子分类

• 每个部分单独切换（非全局）
• 缩进显示，字体略小
• 降低不透明度以实现视觉层次结构
• 保持分类徽章颜色

版本

• 当前 (Current): 1.0.1
• 最低 Discourse 版本: 3.3.0
• 作者: Andy@Focallocal

许可证

MIT 许可证 - 请参阅 LICENSE 文件

支持

报告问题：GitHub · Where software is built

[Lilly (Lillian Louis)]

干得好

类别设置提示

与其让管理员输入类别 slug，不如在您的 settings.yml 文件中使用以下内容，例如：

categories_to_hide:
  type: list
  list_type: category
  default: ""
  description:
    en: "Categories to hide from sidebar completely."

这将为您提供如下设置：

如果您想使用组下拉菜单，也可以对组执行相同的操作：

groups_this_setting_applies_to:
  type: list
  list_type: group
  default: ""
  description:
    en: "Groups this setting will apply to."

这将显示如下内容：

[jenmck (jen)]

我真的很喜欢这个，这绝对是我考虑过的事情，所以谢谢你！

问题——如果用户在给定部分中没有任何类别的访问权限，该部分本身还会显示给用户吗？

[NateDhaliwal]

是的，它包含：

javascripts%2Fdiscourse%2Fapi-initializers%2Fsidebar-organizer.js

[Drew-ART (Drew)]

不，如果用户没有访问权限，则类别/子类别将被隐藏。您也可以通过设置手动隐藏您选择的任何类别。

[Drew-ART (Drew)]

谢谢莉莉。我会更新那个以及我最近的其他组件，使它们变得更好。