Melhor estratégia para encontrar o template certo para editar?

Dev
1

Ainda sou novo no Discourse, mas estou aprendendo mais sobre como programar sobre ele para personalizar coisas. Estou tentando descobrir a melhor maneira de inserir código em locais específicos de uma página (mais direcionado do que em uma área de saída geral). Parece que terei que substituir o modelo que controla esse local.

Entendo que, seja no que fizer na área <head> do meu painel de personalização ou em um repositório GitHub separado que usarei como tema, terei que:

  1. Encontrar o modelo correto para editar
  2. Reimprimir todo o modelo onde estiver fazendo minha codificação (painel, repositório, etc.) e
  3. Fazer as alterações que desejo no modelo

O passo 1 está se mostrando um obstáculo. Como encontrar o modelo correto para editar?

É isso que entendi: os modelos do Discourse estão aqui, e parece que os modelos “reais” que quero editar geralmente estão no arquivo de componentes aqui.

Como exemplo, digamos que eu queira adicionar uma linha a cada listagem de grupo na página de índice de grupos (o equivalente a esta página). Onde está o modelo para isso? Minha melhor suposição é que seja o modelo de cartões de grupo, mas não tenho certeza, especialmente porque sou totalmente novo no Ember.

Existe uma maneira mais infalível para eu identificar o modelo correto?

2

Você já tentou a extensão do navegador Ember?

Ela mostra templates e componentes:

image
image494×456 25.2 KB

3

Isso parece ótimo. Você está se referindo ao Ember Inspector?

4

Entendido. Ao usá-lo, há uma coisa que não estou entendendo (provavelmente tem a ver com eu ser novo no Ember):

Se você olhar a página de grupos do Discourse, cada entrada de grupo tem um nome e uma contagem de usuários.

Usando o Inspetor do Ember, consigo ver que o nome vem do template groups-info, mas de onde vem a group-user-count? (não parece ter uma entrada no Inspetor do Ember)

5
6

Obrigado. Vejo que group-user-count aparece na linha 55.

Isso significa que, se eu quisesse, digamos, adicionar uma linha logo antes da linha group-user-count, eu teria que copiar as 100 linhas inteiras desse arquivo index.hbs para o meu código e inseri-las assim:
<script type="text/x-handlebars" data-template-name="groups/index">
[100 linhas aqui]
</script>

7
  • Normalmente, você verifica se há uma saída de plugin adequada e a utiliza.
  • Você pode tentar direcionar elementos com jQuery, mas isso não funcionará se estiver tentando alterar um elemento iterativo.

Se não for possível fazer nenhuma dessas coisas:

  • peça à equipe do Discourse que adicione uma saída de plugin, fornecendo a justificativa
  • substitua o template inteiro pelo seu, como você sugeriu.
8

Você está se referindo a alterar o código nas saídas ao redor? (como em components/group-info)

EDIT: Desculpe, eu confundi templates com saídas de plugin. Entendo que as saídas de plugin são linhas no código do Discourse (como {{plugin-outlet name="topic-above-post-stream" args=(hash model=model)}) que a equipe do Discourse colocou como um ponto de ancoragem que você pode usar para alterar o código.

9

EDIT: Movi este acompanhamento para aqui porque trata de um problema ligeiramente diferente.