跳到主要内容

指南

选择主题和深色模式

品牌与站点设置 · 阅读约 5 分钟

主题决定社区的品牌颜色、字体、圆角和阴影,浅色模式和深色模式分别设置。你可以用主题匹配品牌的配色方案,并选择成员默认以浅色还是深色模式浏览社区。

谁可以操作:所有者和管理员。成员可以自己选择浅色或深色模式。 · 在哪里:网页端(站点后台)。成员可以在网页端和 Mateflow App 中切换模式。 · 套餐:主题和颜色不受套餐限制。自定义 CSS 取决于你的平台套餐。

打开主题页面

前往后台 → 外观 → 主题。也可以在品牌化页面上点击在主题中管理配色与字体 →。

  • 当前主题显示成员现在看到的主题,带有上线标记。
  • 主题库列出你的其他主题。你可以搜索或排序,例如按最近更新排序。
  • 页面顶部的按钮是 App Theme、Settings 和 Add Theme。

从预设添加新主题

  1. 点击 Add Theme。
  2. 输入主题名称(最多 50 个字符)。
  3. 选择一个预设。可以用搜索预设... 或分类筛选来查找。主题总是从某个预设开始。
  4. 要立即上线,勾选立即发布。
  5. 点击创建主题。

如果想复制现有主题,打开它的 ⋯ 菜单,点击克隆,输入新主题名称,然后点击克隆主题。副本会保留所有浅色和深色颜色、排版、间距、边框和阴影。

编辑主题的颜色和字体

在当前主题上点击自定义,或打开其他主题的 ⋯ 菜单并点击编辑。编辑器打开后,标题显示为编辑主题: 加上主题名称。

  1. 在颜色模式下选择浅色或深色。两种模式各有自己的颜色,所以两种都要设置。
  2. 在颜色标签页中,设置 Background、Primary、Accent、Card 和 Sidebar 等颜色。每种文字颜色都会显示它的对比度。如果某个颜色达不到 WCAG AA 对比度标准,点击智能调整修正它。
  3. 在排版标签页中,选择字体系列和字间距。
  4. 在其他标签页中,设置圆角和阴影。如果你的平台套餐包含自定义 CSS,它也在这里。
  5. 查看实时预览。可以在 Feed、帖子、个人资料和界面之间切换,也可以在桌面视图和移动视图之间切换。
  6. 点击保存。

保存当前主题会改变成员看到的样子。想安全地尝试修改,可以编辑主题库中的某个主题,准备好后再发布。

发布主题

在主题库中的某个主题上点击发布。它会成为当前主题,之前的主题会回到主题库。同一时间只有一个主题处于上线状态。

除了正在上线的主题,其他主题都可以删除:打开它的 ⋯ 菜单,点击删除并确认。删除后无法撤销。

将主题恢复到早期版本

每次编辑、发布或还原主题时,Mateflow 都会为它保存一份快照。

  1. 打开主题的 ⋯ 菜单,点击历史记录。
  2. 在版本历史中找到你想要的版本,点击还原。
  3. 确认。Mateflow 会先把当前状态保存为一份新快照,所以你可以撤销这次还原。

设置默认的浅色或深色模式

默认模式适用于所有还没有自己选择模式的人。

  1. 在主题页面上,点击 Settings。
  2. 在默认外观中选择浅色、深色或跟随系统。跟随系统会按每个人的设备设置显示。
  3. 点击保存设置。

成员如何切换浅色和深色模式

成员可以随时覆盖你的默认设置:

  • 网页端:点击头像,再点击外观(或前往设置 → 外观)。在主题下选择跟随社区、系统、浅色或深色。跟随社区会显示你设置的默认模式。
  • App:打开设置与隐私 → 外观。在主题下选择跟随社区、跟随系统、浅色或深色。

成员不能选择其他主题。你发布的主题颜色适用于所有人,按各自选择的模式显示。

为 Mateflow App 设置单独的颜色

默认情况下,Mateflow App 使用取自当前网页主题的颜色。如果只想为 App 修改颜色:

  1. 在主题页面上点击 App Theme。
  2. 选择浅色或深色,然后设置你想修改的颜色。留空的颜色使用 App 的默认值。Derive from web 会根据你的网页主题填入一份初始草稿。
  3. 点击保存。

App 的覆盖设置与当前主题一起保存,App 保留自己的字体。要让 App 重新跟随网页主题,点击 Clear override 并确认。

相关文章

这篇指南对你有帮助吗?

返回指南列表

找不到所需的内容?

如果你是某个社区的成员,请联系该社区的管理员;如果你正在 Mateflow 上搭建或运营社区,我们的团队可以帮你。

开始免费试用