|||
-|-|-|
| Visão Geral | O DiscoTOC permite que você crie uma lista de conteúdo para seus tópicos com um clique.
|
| Prévia | Beginner's guide to using Discourse Themes (Por favor, acesse o link em uma nova aba) |
| Link do Repositório | https://github.com/discourse/DiscoTOC
| Não familiarizado com os Temas do Discourse? | Por favor, visite a página oficial para o Guia para Iniciantes no Uso de Temas do Discourse
Exemplo
Desktop
Mobile
Funcionalidades
toc = table of contents (índice)
- Crie uma lista de conteúdo (TOC) com um clique através do botão de configuração acima do menu, com base no conteúdo atual.
- O TOC será exibido continuamente na página – o conteúdo de rolagem e os links do tópico estão sincronizados.
- Quando você rolar o conteúdo do tópico na página, o TOC correspondente será destacado (exibido em verde).
- Adicione atributos aos títulos (você pode vincular a conteúdo específico de outros tópicos/posts).
- Clicar nos links do TOC navegará o navegador para a posição correspondente no conteúdo principal (rolagem sincronizada).
- Adicione um link copiável para cada título (se desejar).
- Suporte a RTL.
- O esquema de cores é baseado no esquema de cores que você está usando atualmente.
Como Funciona
Por padrão, os títulos do conteúdo atual serão marcados como TOC (através do botão do composer para realizar a operação acima), e se o seu tema atual estiver marcado, ele também será convertido em TOC (isso está relacionado à hierarquia do título atual). Todos os títulos de conteúdo serão convertidos em TOC – isso significa que a configuração do seu título de arquivo MD deve estar correta; se a hierarquia do seu título estiver incorreta, o resultado da conversão também estará incorreto.
# heading 1
## heading 2
### heading 3
#### heading 4
##### heading 5
###### heading 6
Você pode ajustar a hierarquia conforme necessário, mas deve garantir a correção da hierarquia.
# heading 2
## heading 3
## heading 3
### heading 4
## heading 3
# heading 2
etc...
Para garantir que os links funcionem, todos os títulos devem ter um atributo Id.
Este componente verificará automaticamente o Id do título; se o título existir, o componente funcionará de forma mais eficaz. Além disso, o Id é mais útil ao criar tópicos manualmente.
Se o seu título não tiver um Id, este componente criará automaticamente um Id com base no conteúdo do título (caracteres desnecessários serão ignorados).
Quando todo o conteúdo acima for concluído, o TOC criará um link para o conteúdo principal com base nos títulos, como mostrado abaixo:
![]()
Configurações
Este componente tem apenas uma configuração, que é o ícone do TOC (esta imagem será usada nas configurações posteriores; o oficial não recomenda modificar este ícone.)
Tradução e Localização
Este componente requer pouca tradução, apenas os 3 campos a seguir precisam ser traduzidos.
table_of_contents: "table of contents (índice)"
Isso será exibido ao abrir o TOC em dispositivos móveis.
insert_table_of_contents: "Insert table of contents (inserir índice)"
Isso será exibido quando o TOC for inserido na página do tópico.
topic_will_contain_a_table_of_contents: "This topic will contain a table of contents (este tópico conterá um índice)"
Isso será exibido na página de visualização ao editar o conteúdo do tópico.
Como Criar um Título
- Títulos de conteúdo precisam ser criados com a sintaxe correta.
- Clique na opção de menu na página (isso só é exibido para tópicos e posts regulares; esta opção não será exibida se você estiver respondendo ou enviando mensagens privadas).
- Inserir na página do tópico.
O que Acontece com o Widget de Progresso de Leitura Quando Usamos o TOC
Como você pode saber, não é possível exibir o progresso de leitura e o TOC simultaneamente na página.
A solução oficial é que, se o TOC existir ao ler o primeiro post, apenas o TOC será exibido na página, e o widget de progresso de leitura será ignorado e não exibido.
Quando você rolar além do primeiro post, o TOC não será exibido; em vez disso, uma barra de progresso de leitura de todo o conteúdo será exibida.
Em resumo, o TOC é válido apenas para o primeiro post; posts subsequentes usarão a barra de progresso de leitura.
A exibição é a mesma para dispositivos móveis e desktops.
Quais Problemas Podem Ocorrer ao Usar Este Componente
De acordo com os autores e o oficial, nenhum problema foi encontrado ao usar este componente.
Toda a exibição de conteúdo é feita no lado do cliente, em termos técnicos, todo o conteúdo é feito no front-end, portanto, o fornecimento de dados do back-end não é afetado.
Quando você desabilita este componente, todo o conteúdo voltará ao normal.
Limitações de Uso
Este componente usa o layout de tema padrão.
Se o seu layout modificar o uso de títulos, este componente TOC não funcionará corretamente.
Por exemplo, é sabido que este componente não funciona corretamente com o tema Vincent.
O suporte para temas populares é a próxima consideração e desafio para o plugin oficial.
Desenvolvedor
O autor oficial desenvolveu com base na biblioteca tocify.js de Greg Franko.
No entanto, infelizmente, esta biblioteca não é atualizada há muito tempo, então o autor removeu muito conteúdo desnecessário, recursos e código desta biblioteca e integrou os recursos relevantes ao Discourse.
O tamanho total do componente é de aproximadamente ~ 4kb (com compressão gzip).
O autor também agradece a @erlend_sh por muitas boas sugestões e a @david por ajudar com a tradução.
O que Precisa Ser Melhorado (TODO)
- Exibição em tempo real do TOC durante a edição (isso pode consumir muitos recursos)
- Suporte para temas populares para exibir o TOC
- Copiar automaticamente o link do botão do título para a área de transferência ao clicar nele.
O autor afirma sobre o lançamento desta versão: este é um lançamento inicial. Se você tiver alguma dúvida ou sugestão para este componente, sinta-se à vontade para entrar em contato diretamente com o autor original.
Para as instruções oficiais e links sobre este componente, bem como discussões, consulte: DiscoTOC - automatic table of contents.
Ajuda Técnica (Chinês)
Se você tiver outras dúvidas ou precisar de ajuda, visite nosso site (Chinês): iSharkFly - 飞鲨




