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
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
são opcionais, então você só precisa criar os que necessita.
Para aqueles que procuram dividir o SCSS do tema em vários arquivos, isso agora é possível.
Para aqueles que procuram dividir o tema em vários arquivos JS, basta adicionar os arquivos JS desejados no diretório javascripts.
A estrutura do arquivo about.json está abaixo, e você pode ver mais informações sobre ele em https://meta.discourse.org/t/adding-metadata-to-a-theme/119205:
{
"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"]
}
Instruções sobre como adicionar configurações ao seu tema disponíveis aqui: Add settings to your Discourse theme.
Para informar ao Discourse que você 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 personalizado 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
Última Revisão por @SaraDev em 2022-08-15T21:00:00Z
Este documento é controlado por versão - sugira alterações no github.

