0

Gerador de índice

Cole Markdown ou HTML e obtenha um índice aninhado e clicável com slugs de âncora reais à prova de colisão no estilo GitHub, além do conteúdo original com IDs de cabeçalho injetados.

A detecção automática procura primeiro tags

-

reais e, em seguida, cabeçalhos Markdown #.

Adiciona um atributo {#slug} após cada título - suportado por kramdown, Pandoc, MkDocs e GitHub Pages (Jekyll).

Buy Me a Coffee at ko-fi.com
Processando... 0%
Detectando formato de conteúdo
Analisando títulos
Atribuindo slugs seguros contra colisões
Construindo índice

Resultado

Um índice analítico é tão útil quanto os links âncora abaixo dele, e os links âncora só são confiáveis se cada título receber um slug único e previsível. Este gerador analisa os títulos de tudo o que você cola - Markdown ou HTML - e atribui a cada um deles uma âncora real no estilo GitHub: texto minúsculo, espaços e pontuação substituídos ou removidos e, criticamente, um sufixo genuíno à prova de colisão sempre que dois títulos produziriam o mesmo slug. A segunda "Introdução" em um documento torna-se introdução-1, a terceira torna-se introdução-2, rastreada com um mapa de ocorrência em execução exatamente da mesma forma que o próprio slugger do GitHub funciona - não um atalho que substitui silenciosamente links anteriores quando os títulos se repetem, que é a forma mais comum de quebra de scripts de índice de índice rolados à mão.

A análise de Markdown é baseada em linha de propósito, porque o modo de falha clássico para uma implementação ingênua é tratar um "#" escrito dentro de um bloco de código protegido como um título. Esta ferramenta rastreia se uma cerca ``` ou ~~~ está aberta no momento enquanto percorre o documento linha por linha e reconhece apenas títulos ATX (# a ######) fora das cercas abertas - portanto, um exemplo de código mostrando comentários do shell ou um "# comentário" do Python nunca polui seu índice. A entrada HTML segue um caminho diferente e igualmente real: é analisada com o próprio DOMParser do navegador, os títulos são selecionados pelo nome da tag e o atributo id de cada um é definido diretamente no elemento real antes do documento ser serializado de volta para uma string.

Duas coisas saem do outro lado. Primeiro, o índice em si, exportado como uma lista Markdown aninhada (- [Título](#slug), recuado pelo nível do título) e uma lista HTML aninhada (<ul><li><a href="#slug">), cada uma com seu próprio botão de cópia. Em segundo lugar, seu conteúdo original com as âncoras realmente conectadas: para entrada Markdown, você pode escolher a sintaxe de atributo de título {#slug} amplamente suportada usada por kramdown, Pandoc, MkDocs e Jekyll do GitHub Pages, ou voltar para tags de título HTML simples com id="slug" já definido se o seu renderizador de destino não entender a sintaxe do atributo. Para entrada HTML, o id é injetado diretamente no elemento de cabeçalho analisado - não há um "modo" separado para escolher porque as tags já existem.

Tudo é executado localmente no seu navegador: a análise, a matemática do slug e a remontagem do documento acontecem em JavaScript na página que você está vendo agora, sem nada carregado em lugar nenhum. Isso é importante para rascunhos de documentação, wikis internos ou uma postagem de blog não publicada que você não está pronto para colar em um serviço de terceiros apenas para obter um índice funcional.