O Discourse suporta temas nativos que podem ser obtidos a partir de um arquivo .tar.gz ou de um repositório git remoto, incluindo repositórios privados.
Um exemplo de tema está em: GitHub - discourse/discourse-simple-theme: Sam's simple discourse theme · GitHub
O repositório git será verificado em busca de atualizações (uma vez por dia), ou usando o botão Verificar atualizações. Quando alterações forem detectadas, o botão Verificar atualizações mudará para Atualizar para a mais recente.
Para criar um tema, você precisa seguir uma estrutura de arquivos específica. Estes são os arquivos que você pode incluir:
about.json (obrigatório)
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
Quaisquer um desses arquivos 
é opcional, então você só precisa criar os que você precisa.
Para aqueles que desejam dividir o SCSS do tema em vários arquivos, isso agora é possível.
Para aqueles que desejam dividir o tema em vários arquivos JS, basta adicionar os arquivos JS que você deseja no diretório javascripts.
A estrutura de arquivos about.json está abaixo, e você pode ver mais informações sobre ela em https://meta.discourse.org/t/adding-metadata-to-a-theme/119205:
{
"name": "Meu Tema",
"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": {
"Meu Esquema de Cores": {
"primary": "222222"
}
},
"screenshots": ["screenshots/light.jpeg", "screenshots/dark.jpeg"]
}
Instruções sobre como adicionar configurações ao seu tema disponíveis aqui: Add settings to your Discourse theme.
Para dizer ao Discourse que você vai adicionar um componente de tema e não um tema completo, basta adicionar a linha \"component\": true ao arquivo about.json
A estrutura de arquivos corresponde ao CSS/HTML de personalização do tema.
Leitura adicional
Confira os outros artigos com a tag #themes::tag.
Veja também:
- Developing Discourse Themes & Theme Components
- Install the Discourse Theme CLI console app to help you build themes
- Include assets (e.g. images, fonts) in themes and components
Revisado pela última vez por @SaraDev em 2022-08-15T21:00:00Z
Este documento está versionado - sugira alterações no github.
← START DOCS ASSET MAP
[
{
“local_path”: “/assets/theme-structure-1.png”,
“local_sha1”: “5d81758f2f3090bee941c034a5d5a8165df50ce4”,
“remote_short_url”: “upload://465qlv5OiFWlR8qrBc6wGExEt07.png”
},
{
“local_path”: “/assets/theme-structure-2.png”,
“local_sha1”: “66944b3e613c84ac19333461a11ffb39988b5f32”,
“remote_short_url”: “upload://d4Smpts3JzE3LozxhVOInZNjv3S.png”
},
{
“local_path”: “/assets/theme-structure-3.png”,
“local_sha1”: “971f8599d19fa8f30ba787bf7c74bdc54a5f9228”,
“remote_short_url”: “upload://vQ0g1yk6xAJqM2fLe2nCmTdsK9h.png”
}
]
END DOCS ASSET MAP →