这是一篇关于 Discourse 主题基础的快速入门教程。目标受众是那些对 Discourse 主题尚不熟悉的人。如果您已经使用过 Discourse 主题或主题组件，那么本指南可能不是您必读的内容。
什么是主题和主题组件？
主题或主题组件是一组打包在一起的文件，旨在从视觉上修改 Discourse 或添加新功能。
让我们从主题开始。
主题
一般来说，主题之间并不期望相互兼容，因为它们本质上是不同的独立设计。可以将主题比作皮肤，或者 Android 上的启动器。您可以安装多个启动器，但无法同时使用两个。您的默认 Discourse 安装自带两个主题：Foundation 和 Horizon。
Foundation 呈现的是简洁经典的 Discourse 外观，而 Horizon 则提供更现代的设计，并拥有多种配色方案可供选择（例如 Horizon、Royal、Clover、Lily、Violet 和 Marigold —— 每种都有浅色和深色变体）。
默认
以及深色
如果这还不够，您想要更多选择，那么您可以相当轻松地安装额外主题。以下是 Meta 上提供的一些免费主题示例：
如您所见，根据您的主题选择，您的站点外观可能会有显著差异；但这还不是全部。除了主题之外，Discourse 还支持主题组件。
主题组件
我们使用“主题组件”这一术语来描述那些更侧重于自定义 Discourse 某一方面的软件包。由于其专注范围较窄，主题组件几乎总是相互兼容的。这意味着您可以在任何主题下同时运行多个主题组件。您可以将主题组件比作手机上的应用程序。
和往常一样，举例是描述事物的最佳方式，因此以下是 Meta 上提供的一些主题组件示例：
该主题组件利用您现有的分类详细信息（包括名称、描述和颜色），在相关分类页面的顶部生成横幅。
该主题组件为移动和桌面视图添加了一个额外的顶部页眉，用于展示您的品牌标志、导航链接和社交图标。品牌标志可以是图片或文本。
如您所见，主题组件的专注范围要窄得多。因此，在大多数情况下，它们彼此兼容。现在您对 Discourse 主题和主题组件有了基本的了解。让我们深入探讨一下。
Discourse 主题界面
让我们看看主题界面。访问 your.site.com/admin/customize/themes，您应该会看到类似以下内容：
这是 Discourse 中的默认主题界面。您可以在这里执行多项操作：
- 设置默认活动主题
- 选择向用户开放哪些主题
- 创建新主题和主题组件
- 导入新主题和主题组件
- 将主题组件添加到主题中
- 修改配色方案
- 更改主题设置
- 预览主题
让我们逐一介绍这些功能。
设置默认活动主题
默认主题名称旁边的小勾号表示这是您站点上的活动主题。
现在，让我们将活动主题更改为 Dark。点击 Dark 主题，您应该会看到以下内容：
您站点上的活动主题将设置为 Dark。这意味着访问您站点的所有人都将看到以下内容：
此时，勾号会移动到 Dark 主题名称旁边，表示它是活动主题。
选择向用户开放哪些主题
能够为您的站点设置主题固然很好，但还有什么更棒呢？让用户自己决定。Discourse 允许您向用户提供不同的主题，让他们根据自己的偏好设置主题。他们的选择仅限于自己的账户，不会影响您的活动主题选择或其他用户的选择。
例如，您可以将活动主题设置为默认主题（浅色），但提供深色主题作为选项。让我们现在就试试。在主题界面中：
您所有的活动主题，无论是站点上设置的默认主题还是您标记为用户可选的主题，都会显示在这里：
但只有默认主题会带有绿色勾号。
现在，让我们尝试将 Red 主题设置为用户可选。
您只需要点击它，然后勾选“用户可以选择主题”复选框。
就是这样！您会注意到它会自动从不活动主题列表移动到活动主题列表。
您的用户将能够通过访问以下地址来选择他们喜欢的主题：
your.site.com/my/preferences/interface
创建新主题和主题组件
要创建新主题或主题组件，请点击两个“安装”按钮中的任意一个。
随后会出现一个对话框。在左侧菜单中选择“创建新”选项。您需要为要创建的内容提供名称，并决定它是主题还是主题组件。
我们已经大致介绍了主题和主题组件的基础知识。如果您还记得，主题组件通常专注于修改 Discourse 的某个区域，而主题通常涵盖多个方面。您还应注意，一个主题下可以包含任意数量的主题组件，但主题组件下不能包含其他主题组件。暂时不必为此担心，稍后会有更详细的解释。
现在，假设您已经决定了名称并决定将其创建为主题。一旦点击“创建”按钮，主题即被创建，您将能够：
- 更改主题/主题组件的名称
- 为主题设置或更改配色方案
- 向主题/主题组件添加 HTML / CSS / JS
- 向主题添加文件或上传内容
- 向主题添加子组件
具体的自定义操作超出了本指南的范围，因此在此就此打住。
添加 HTML / CSS / JS 的界面如下（点击上述第 3 项后）：
导入新主题和主题组件
我们已经有关于如何导入主题的指南，但由于本指南旨在涵盖所有基础知识，因此这里也会包含导入方法。
要导入主题或主题组件，请点击两个“安装”按钮中的任意一个。
“热门”部分允许您从我们最受欢迎的主题和组件列表中进行预览或安装。
您也可以通过设备导入主题文件，或通过主题仓库链接导入。每个主题的作者会在主题话题中提供仓库链接。导入主题后，前面讨论过的所有操作都适用。您可以将其设置为默认主题、使其用户可选等等。
如果您导入的是主题组件，还可以将其添加到任何主题中。这在下一节中有详细说明。
将主题组件添加到主题中
假设您喜欢 Discourse 分类横幅主题组件并希望使用它。操作步骤如下：
- 按照上述方法从仓库导入主题组件
- 将其作为主题组件添加到您的活动主题或用户可选主题中
您可以这样操作：
导入组件后，前往您要添加它的主题页面，查找“包含的组件”部分。
该列表将显示所有已安装的主题组件。从那里您可以将主题组件添加到主题中。添加 Versatile Banner 主题组件的效果如下：
在单个组件的页面上也存在类似的“在这些主题中包含组件”选项。这允许您将一个组件同时添加到多个主题中。
基本上就是这样。Discourse 分类横幅现在已成为默认主题的活动组件。如果您也想将其添加到 Dark 主题中，只需为 Dark 主题重复添加主题组件的过程即可。
如果您已将 Dark 主题设置为用户可选，并同时将 Discourse 分类横幅主题组件添加到其中，那么选择 Dark 主题作为活动主题的用户也将获得 Discourse 分类横幅主题组件，因为它是 Dark 主题的“子主题”。
一个主题下可以拥有无限数量的主题组件，正如我们之前讨论的，它们通常彼此兼容。因此，您可以这样做：
所有这些组件将同时作为默认主题的活动组件运行。
修改配色方案
配色方案是您选择的颜色调色板，用于生成主题中元素的颜色。这里不会深入细节，但会向您展示如何使用配色方案。
导航到 your.site.com/admin/customize/colors，您将看到：
从这里您可以编辑配色方案或创建新的配色方案。要编辑配色方案，请点击它并更改颜色以符合您的喜好。
要创建新的配色方案，请点击此处。
完成颜色更改后，现在需要将该配色方案设置为活动配色方案，应用于您的活动主题或用户可选主题。为此，前往主题页面并查看此处：
主题设置
Discourse 主题可以包含设置。这些设置旨在为您提供一种简便的方式来根据需求配置主题或主题组件。例如，Discourse 按钮样式主题就有一些设置，只需更改几个值即可轻松自定义按钮的外观。
并非所有主题/主题组件都有设置，但对于那些有的，它们总会显示在这里。设置通常包括作者提供的说明，帮助您确定需要进行哪些更改。
预览主题
有时，在应用主题之前，您需要查看它在您的站点上的效果。Discourse 提供了一种简便的方法来预览主题，而无需将其设置为活动主题。
在主题页面上，点击此处：
将打开一个新标签页，实时预览该主题在您的站点上的效果。您可以导航到不同的页面，查看整体效果。
预览主题最棒的一点是，您可以实时测试更改，而无需担心如果出现问题会对您的站点造成任何影响。
附加信息
安全模式
Discourse 内置了一种绕过当前活动主题的方法，以防出现问题。例如，组件代码中的 JavaScript 错误可能导致您的站点无法正常工作。要绕过当前活动主题，只需访问：
your.site.com/safe-mode
您将看到：
从这里您可以禁用当前活动主题，导航到主题页面，修复问题或永久禁用该主题。
获取新主题
查找新主题和主题组件最直接的方法是查看 Meta 上的 Customization > Theme 分类。
进一步阅读
Designer's Guide to getting started with themes in Discourse
Developing Discourse Themes & Theme Components
Using Safe Mode to troubleshoot issues with themes and plugins
Structure of themes and theme components
Create and share a font theme component
Create and share a color scheme
Use Discourse Core Variables in your Theme
Add settings to your Discourse theme
Theme Creator, create and show themes without installing Discourse!
如果您有任何问题，请随时提问。