Como faço para criar algum tipo de tabela de conteúdo no wiki do GitHub?

102

Se você olhar aqui: http://en.wikipedia.org/wiki/Stack_Overflow

Você notará que há uma pequena seção de "Conteúdo", se você clicar em um dos links, será direcionado para uma seção específica na página.

Como faço isso no wiki do GitHub? Com Markdown ou o que quer que eles usem?

Evan
fonte
3
Relacionado, mas não duplicado exato, que entra em mais detalhes: stackoverflow.com/q/9721944/2291
Jon Adams

Respostas:

111

É bem demonstrado no Índice da folha de referência do Markdown .

##### Table of Contents  
[Headers](#headers)  
[Emphasis](#emphasis)  
...snip...    
<a name="headers"/>
## Headers

Se você passar o mouse sobre um cabeçalho em um arquivo GitHub Markdown, verá um pequeno link simples à esquerda dele, você também pode usar esse link. O formato desse link é <project URL#<header name>. O <header name>deve estar todo em minúsculas.

RyPeck
fonte
36
Certamente há uma maneira de autogerá-lo como _ _ TOC _ _ do MediaWiki?
LB--
17
@ LB--: Se você editar uma página wiki do GitHub e alterar o menu suspenso "estilo de edição" para "MediaWiki", você pode simplesmente usar o MediaWiki __TOC__diretamente. Claramente, a lógica de geração automática subjacente está lá. Mas a funcionalidade não parece estar exposta em seu estilo de edição Markdown. Muito lamentável. Vamos todos começar a enviar solicitações de recursos para ele e talvez eles o ativem.
Andrew Janke
3
Eu me arrependo da existência de "lógica de autogeração subjacente"; parece que os diferentes "estilos de edição" passam por diferentes renderizadores. Ainda assim, seria ótimo ter isso na versão MD, já que é muito popular e não poderia ser difícil de adicionar.
Andrew Janke
5
@AndrewJanke Eu olhei mais para ele, parece que o formato MarkDown não tem suporte para geração automática de índices e eles estão orgulhosos disso.
LB--
6
Existe um problema na criação de links. Eles devem ser minúsculos. Eu não sabia disso e estava me perguntando por que meu TOC não está funcionando. Eu usei em #Headersvez de #headers. Achei que era um erro de digitação na sua resposta. Talvez você possa adicionar esta informação à sua resposta.
t3chb0t
20

Uma solução possível (semiautomática) é a de Eugene Kalinin github-markdown-toc. Essa ferramenta essencialmente README.mdanalisa seu arquivo e identifica os #cabeçalhos para criar um sumário.

  1. Baixe o script https://github.com/ekalinin/github-markdown-toc
  2. Alimente seu README.mdroteiro (conforme observado no de Eugene README.md)

    cat README.md | bash github-markdown-toc

  3. Recorte e cole o TOC gerado e coloque-o no topo do seu README.mdarquivo

Observe que esta bashimplementação só funciona no Linux (pelo que posso dizer).

Como uma observação lateral, há uma implementação golang e provavelmente é mais trabalhoso para começar a trabalhar.

John Tran
fonte
14

https://github.com/jonschlinkert/markdown-toc

  • git clone your-repo.wiki.git(adicione o .wikidireito antes .gitde clonar o wiki
  • npm i -g markdown-toc
  • Insira <!-- toc -->( diferencia maiúsculas de minúsculas) na marcação do seu wiki
  • markdown-toc -i my-wiki-markdown.md( -iirá editá-lo no local)
  • Lucro

Atualização: acho que https://github.com/thlorenz/doctoc é mais popular agora.

Corysimmons
fonte
12

Atualmente não é possível fazer isso usando a sintaxe de redução ( .md). Há uma discussão não oficial em andamento sobre a geração automática de índice TOC em arquivos de markdown renderizados, como o README.mdqual lista algumas das ideias.

No entanto, existem algumas outras soluções alternativas, como:

Kenorb
fonte
1
Sim, fui convertido para asciidoc principalmente para o ToC e vinculando a cabeçalhos. Cansei de esperar que Markdown o alcançasse.
Ciro Santilli 郝海东 冠状 病 六四 事件 法轮功
8

Se você não estiver em posição de manter o Markdown , faça o seguinte:

No entanto, usando arquivos Markdown no GitHub / repo , você pode obtê-lo nas páginas do GitHub como na Wikipedia

  • quando Jekyll é ativado, ele gera páginas GitHub usando Kramdown por padrão
  • Kramdown vem com Table Of Content. Use {:toc}sintaxe. Veja a explicação .
Chetabahana
fonte
5

Código Visual Studio

Se acontecer de você usar o Visual Studio Code , há uma extensão fácil de usar chamada Markdown All in One que pode fazer o sumário para qualquer arquivo .md em um instante.

insira a descrição da imagem aqui

Basta abrir a Paleta de Comandos ( Ctrl-Shift-P) ->Markdown: Create Table of Contents

MD original Após a inserção automática de TOC

A atualização automática atrapalha seu sumário editado?

Como uma dica adicional, você pode desativar as "atualizações automáticas do TOC ao salvar" usando

  "markdown.extension.toc.updateOnSave": false,

nas configurações do Visual Studio (Paleta de comandos -> Preferências: Abrir configurações (JSON)).

np8
fonte
2

Devido ao fato de que o github tem sua própria maneira de gerar atributos id = ".." em h1, h2, h3, etc ... cabeçalhos na versão html após o processamento do Markdown (por exemplo, o Bitbucket usa um padrão pouco diferente de lentidão no título dos cabeçalhos para id = "slug") é útil não reinventar a roda e usar a biblioteca que fez a engenharia reversa desse processo.

Encontrei uma biblioteca muito boa para essa tarefa chamada markdown-toc .

Para mim parece a melhor solução porque sempre instalei o node na minha máquina.

Basta executar npx remarcação-toc -i file.md .

E parece que é uma das ferramentas mais populares para essa tarefa - pelo menos no ecossistema node.js.

ls
cat <<EOF >> test.md | tee 
## Table of Contents

<!-- toc -->
- old toc 1
- old toc 2
- old toc 3
<!-- tocstop -->

## abc
This is a b c.

## xyz
This is x y z.
EOF
ls
cat test.md
npx markdown-toc -i test.md
cat test.md

resultado:

insira a descrição da imagem aqui

stopopa
fonte