主题和主题组件的结构

Discourse 支持 原生主题,这些主题可以来自 .tar.gz 存档或远程 git 仓库,包括 私有仓库

一个主题示例位于:GitHub - discourse/discourse-simple-theme: Sam's simple discourse theme

git 仓库会检查更新(每天一次),或者通过使用 检查更新 按钮。检测到更改时,检查更新 按钮将变为 更新到最新

image

要创建主题,您需要遵循特定的文件结构。您可以包含以下文件:

about.json (必需)

common/common.scss
common/header.html
common/after_header.html
common/footer.html
common/head_tag.html
common/body_tag.html
common/embedded.scss

desktop/desktop.scss
desktop/header.html
desktop/after_header.html
desktop/footer.html
desktop/head_tag.html
desktop/body_tag.html

mobile/mobile.scss
mobile/header.html
mobile/after_header.html
mobile/footer.html
mobile/head_tag.html
mobile/body_tag.html

locales/en.yml
locales/{locale}.yml

stylesheets/{anything}/{anything}/{anything}.scss

javascripts/{anything}.js
javascripts/{anything}.hbs
javascripts/{anything}.hbr

assets/{asset_filename}

settings.yml

上面 :arrow_up: 的任何文件都是可选的,因此您只需要创建需要的那些文件。

对于那些希望将主题 SCSS 分割成多个文件的用户,现在已经可以实现了。

对于那些希望将主题分割成多个 JS 文件的用户,只需将您想要的 JS 文件添加到 javascripts 目录中即可。

about.json 文件结构如下,您可以在 Adding metadata and screenshots to a Theme 处了解更多相关信息:

{
  "name": "My Theme",
  "component": false,
  "license_url": null,
  "about_url": null,
  "authors": null,
  "theme_version": null,
  "minimum_discourse_version": null,
  "maximum_discourse_version": null,
  "assets": {
    "variable-name": "assets/my-asset.jpg"
  },
  "color_schemes": {
    "My Color Scheme": {
      "primary": "222222"
    }
  },
  "screenshots": ["screenshots/light.jpeg", "screenshots/dark.jpeg"]
}

关于如何向主题添加设置的说明请参见此处:Add settings to your Discourse theme

要告诉 Discourse 您将添加一个 主题组件 而不是一个完整主题,只需在 about.json 文件中添加一行 "component": true 即可。

文件结构与主题自定义 CSS / HTML 相匹配。

更多阅读

查看带有 #themes::tag 标签的其他文章。

:information_source: 另请参阅:


最后由 @SaraDev2022-08-15T21:00:00Z 最后审阅


此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议更改。

此文档是版本控制的 - 在 github 上建议

62 个赞
Alien Night Theme - A free Dark Theme for Discourse
Override values for auto-generated color variables
How to modify the header HTML, but still remaining the default founctions
Custom user fields show on Activity, but not Summary page
Add Unsolved button to top menu using custom HTML
How do I get started with Discourse development as a regular end user with no programming experience?
Custom assets upload folder?
Some basic questions about discourse and rails
Color Scheme Contest (with Prizes!)
Add support for theme settings
Create and share a font theme component
Create and share a color scheme
Split up theme SCSS into multiple files
Theme Developer Quick Reference Guide
Theme Developer Tutorial: 2. Creating a remote theme
Mobile View Loading different HTML as compared to Desktop
Developing Discourse Themes & Theme Components
Minimizing Maintenance on Theme Customizations
Need help with theme component Github
Allow users to select new color palettes
Challenges creating a custom color palette
Adding metadata and screenshots to a Theme
Push to digital ocean from command line and rebuild
Battle Axe - A free theme by the Tappara.co hockey community
Beginner's guide to using Discourse Themes
Discourse deployment using github or bitbucket?
How to remove sticky top bar?
Do you have original customisations?
Add custom content that only appears on your homepage
Highlight color
Timefuser Theme
Compact member list
Understanding the development/deployment process
CSS Theme Contest (with Prizes!)
How to bring in Latest topics when using category boxes
Need to include PGN (chess game notation) in a post
Custom header colour and category icons and login button
Automatic dark mode for embedded comments as well?
Add settings to your Discourse theme
Designer's Guide to getting started with themes in Discourse