Wie verlinke ich einen Teil desselben Dokuments in Markdown?


539

Ich schreibe ein großes Markdown-Dokument und möchte am Anfang eine Art Inhaltsverzeichnis platzieren, das Links zu verschiedenen Stellen im Dokument enthält. Wie kann ich das machen?

Ich habe es versucht

[a link](# MyTitle)

Wo MyTitleist ein Titel im Dokument und das hat nicht funktioniert.



1
Das einzige Problem, das Sie hatten, ist, dass MyTitle kein Titel sein sollte, sondern ein Name eines Ankers in diesem Dokument (wie <a name="MyTitle"> </a>). Dann können Sie Ihre ursprüngliche Verknüpfung an einer beliebigen Stelle im Dokument verwenden.
Userfuser

7
Die akzeptierte Antwort ist für die meisten Leute nicht relevant. Sehen Sie stattdessen die zweite Antwort unten: stackoverflow.com/a/16426829/398630
BrainSlugs83

Antworten:


37

Wenn Sie in Pandoc die Option zum Erstellen--toc von HTML verwenden, wird ein Inhaltsverzeichnis mit Links zu den Abschnitten und zurück zum Inhaltsverzeichnis aus den Abschnittsüberschriften erstellt. Ähnlich verhält es sich mit den anderen Formaten, die Pandoc schreibt, wie LaTeX, rtf, rst usw. Also mit dem Befehl

pandoc --toc happiness.txt -o happiness.html

dieses bisschen Abschlag:

% True Happiness

Introduction
------------

Many have posed the question of true happiness.  In this blog post we propose to
solve it.

First Attempts
--------------

The earliest attempts at attaining true happiness of course aimed at pleasure. 
Soon, though, the downside of pleasure was revealed.

wird dies als der Körper des HTML ergeben:

<h1 class="title">
    True Happiness
</h1>
<div id="TOC">
    <ul>
        <li>
            <a href="#introduction">Introduction</a>
        </li>
        <li>
            <a href="#first-attempts">First Attempts</a>
        </li>
    </ul>
</div>
<div id="introduction">
    <h2>
        <a href="#TOC">Introduction</a>
    </h2>
    <p>
        Many have posed the question of true happiness. In this blog post we propose to solve it.
    </p>
</div>
<div id="first-attempts">
    <h2>
        <a href="#TOC">First Attempts</a>
    </h2>
    <p>
        The earliest attempts at attaining true happiness of course aimed at pleasure. Soon, though, the downside of pleasure was revealed.
    </p>
</div>

1
Danke, das war genau das, was ich brauchte. Ich habe Textmate verwendet, um Markdown in HTML zu konvertieren. Ich werde zu Pandoc wechseln.
Rezeptausschluss

1
Sie können das Demo-Pandoc-tmbundle auf Github ausprobieren (es gibt auch den Emacs-Pandoc-Modus usw.). Das tmbundle verwendet den MultiMarkdown-spezifischen Syntax-Textmarker wieder, sodass es (sehr) wenige Kuriositäten gibt. Außerdem sind viele der zugehörigen Skripte stark angepasst - z. B. Kontext, nicht LaTeX usw. -, aber die Idee ist, dass die Benutzer sie nach Belieben ändern, was ich ziemlich einfach fand. Es sollte wahrscheinlich git clonein das unterste oder äußerste tmbundle-Verzeichnis verschoben werden, ~/Library/Application\ Support/TextMate/Bundlesum die Integration zu vereinfachen.
Antrag

2
Es fügt -1zur ersten Wiederholung der ID, -2zur zweiten usw. hinzu
anwendbar am

6
Ich stellte fest, dass ich dem Befehl pandoc die Option --standalone hinzufügen musste, damit er das Inhaltsverzeichnis selbst in der Ausgabe ausgibt. Ohne diesen Schalter würden die Header zu Links zurück zum benannten Anker #toc, aber nicht zum benannten Anker und zur Liste von Gleichem.
Duncan Lock

4
Dies mag die Frage des OP beantworten, aber für den Rest von uns, die wissen wollen, wie man es in Abschriften macht , ist es ziemlich nutzlos. - Die nächste Antwort ist viel hilfreicher.
BrainSlugs83

934

Github analysiert automatisch Ankertags aus Ihren Headern. Sie können also Folgendes tun:

[Custom foo description](#foo)

# Foo

Im obigen Fall hat der FooHeader ein Ankertag mit dem Namen generiertfoo

Hinweis : Nur eine #für alle Überschriftengrößen, kein Leerzeichen zwischen #und Ankername. Die Namen der Ankertags müssen in Kleinbuchstaben geschrieben und bei mehreren Wörtern durch Bindestriche getrennt sein .

[click on this link](#my-multi-word-header)

### My Multi Word Header

Aktualisieren

Funktioniert auch sofort mit pandoc.


54
Wenn Ihre Kopfzeile mehrere Wörter enthält, "Like this one", ersetzen Sie Leerzeichen durch Bindestriche im Anker [just](#like-this-one).
Mogsdad

3
Funktioniert dies nur für H1-Header? Muss ich beim Verknüpfen mit einem H2-Header (dh ## Foo) auch zwei Zahlenzeichen in den Link einfügen, dh [Foo] (## foo)? Ich kann Ihre oder meine Syntax nicht zum Laufen bringen (mit dem zusätzlichen Nummernzeichen).
GrayedFox

7
@GrayedFox, wenn Sie einen Link für einen ab H2-Header erstellen möchten ## Foo, versuchen Sie [dies ist mein Link zu Foo] (# foo) ... das heißt: einzelner Hash, kein Leerzeichen zwischen Hash und Kleinbuchstaben-Kebab-Fallname- of-header
Abdull

4
Als Tipp: Überprüfen Sie den Anker, der neben Ihrem Header auf Github angezeigt wird, um den entsprechenden Link zu erhalten. Wenn er Sonderzeichen enthält, werden diese automatisch entfernt und der richtige Link wird dort angezeigt.
Alexander Pacha

2
Was ist, wenn die Überschriften eine Nummer haben? # 3. Dritter Punkt [Dritter Punkt] (# 3.-dritter Punkt) funktioniert nicht
Aditya

118

Beim Experimentieren habe ich eine Lösung gefunden, bei der es <div…/>jedoch naheliegend ist, einen eigenen Ankerpunkt auf der Seite zu platzieren, wo immer Sie möchten.

<a name="abcde">

vor und

</a>

nach der Zeile, zu der Sie 'verlinken' möchten. Dann ein Markdown-Link wie:

[link text](#abcde)

Überall im Dokument gelangen Sie dorthin.

Die <div…/>Lösung fügt eine "Dummy" -Division ein, nur um die idEigenschaft hinzuzufügen , und dies kann möglicherweise die Seitenstruktur stören, aber die <a name="abcde"/>Lösung sollte ziemlich harmlos sein.

(PS: Es kann in Ordnung sein, den Anker wie folgt in die Zeile zu setzen, mit der Sie verknüpfen möchten:

## <a name="head1">Heading One</a>

Dies hängt jedoch davon ab, wie Markdown damit umgeht. Ich stelle zum Beispiel fest, dass der Stack Overflow-Antwortformatierer damit zufrieden ist!)


2
Wenn Sie dies tun, sollten Sie sich darüber im Klaren sein, dass das div andere Markdown-Formatierungen entfernt, z ## headers.
2rs2ts

@ user691859 Kannst du das näher erläutern? Vielleicht können wir eine Antwort aktualisieren, damit sie besser funktioniert. Ich habe gesehen, wie TextMate das Hervorheben unterdrückt hat, bis ich das div eingerückt habe, aber kein Problem mit dem verarbeiteten Markdown, der von einem Browser aus angezeigt wird.
Steve Powell

In WriteMonkey habe ich festgestellt, dass die folgenden <div/>Zeilen betroffen sind , wenn ich einem Text voran gehe . Stattdessen muss ich den Text, den ich verlinke, in eine vollständige divTag-Klausel einschließen und das Verhalten mit echtem HTML von Grund auf neu spezifizieren. Boo.
2rs2ts

6
Das funktioniert gut, danke. Für alle, die sich fragen, funktioniert dies auch mit von GitHub gehosteten und angezeigten Markdown-Dateien.
Alex Dean

2
Um zuzukunfts kompatibel mit HTML5 , würde Ich mag empfehlen Ersatz <a name="head1"/>mit <a id="head1"/>.
Binki

74

Dies ist möglicherweise ein veralteter Thread, aber um innere Dokumentverknüpfungen in Markdown in Github zu erstellen, verwenden Sie ...
(HINWEIS: Kleinbuchstaben #title)

    # Contents
     - [Specification](#specification) 
     - [Dependencies Title](#dependencies-title) 

    ## Specification
    Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. 

    ## Dependencies Title
    Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. Example text blah. Example text blah. 
Example text blah. Example text blah. 

Da eine gute Frage gestellt wurde, habe ich meine Antwort bearbeitet.

Eine innere Verbindung kann zu jeder Titelgröße mit gemacht werden - #, ##, ###, #### habe ich ein kurzes Beispiel unten ... https://github.com/aogilvie/markdownLinkTest


In Ihrem Beispiel haben die Link-Tags nur ein #, aber die Header, die sie verknüpfen sollen, haben zwei ##; sollten sie nicht gleich sein?
Karim Bahgat

3
Gute Frage. Die Antwort ist nein. Das # in (#dependencies-title)teilt Github mit, dass dies ein innerer Link ist. Der folgende Text kann eine beliebige Titelgröße haben. Hier ist ein Beispiel Test, den ich gemacht habe ... https://github.com/aogilvie/markdownLinkTest
Ally

1
Hängt das vom Geschmack des Abschlags ab? Es scheint, als würde es im Markdown-Editor gut funktionieren, aber wenn ich in HTML oder PDF speichere, werden die IDs nicht zu den entsprechenden Tags hinzugefügt. Es wäre in Ordnung, wenn ich nur einen Anker hineinwerfen würde, aber es scheint, als ob Ihre Methode so viel sauberer und schneller ist.
Meteorainer

21

Ja, Markdown macht das, aber Sie müssen den Namensanker angeben <a name='xyx'>.

ein vollständiges Beispiel,

Dadurch wird die Verknüpfung erstellt
[tasks](#tasks)

Später im Dokument erstellen Sie den benannten Anker (wie auch immer er heißt).

<a name="tasks">
   my tasks
</a>

Beachten Sie, dass Sie es auch um den Header wickeln können.

<a name="tasks">
### Agile tasks (created by developer)
</a>

13

Im Pandoc-Handbuch wird erläutert, wie Sie anhand Ihrer Kennung eine Verknüpfung zu Ihren Headern herstellen. Ich habe die Unterstützung durch andere Parser nicht überprüft, aber es wurde berichtet, dass es auf Github nicht funktioniert .

Die Kennung kann manuell angegeben werden:

## my heading text {#mht}
Some normal text here,
including a [link to the header](#mht).

oder Sie können die automatisch generierte Kennung verwenden (in diesem Fall #my-heading-text). Beides wird im Pandoc-Handbuch ausführlich erläutert .

HINWEIS : Dies funktioniert nur bei der Konvertierung in HTML , LaTex , ConTeXt , Textile oder AsciiDoc .


9

Einige zusätzliche Dinge, die Sie beachten sollten, wenn Sie jemals Lust auf Symbole in Überschriften haben, zu denen Sie navigieren möchten ...

# What this is about


------


#### Table of Contents


- [About](#what-this-is-about)

- [&#9889; Sunopsis](#9889-tldr)

- [:gear: Grinders](#it-grinds-my-gears)

- [Attribution]


------


## &#9889; TLDR


Words for those short on time or attention.


___


## It Grinds my :gear:s


Here _`:gear:`_ is not something like &#9881; or &#9965;


___


## &#9956; Attribution


Probably to much time at a keyboard



[Attribution]: #9956-attribution

... Dinge wie #, ;, &und :Zeichenkette in der Position anstelle von entkam der Regel ignoriert / gestreift, und man kann auch verwenden Zitat Stil Links zu dem schnellen Einsatz zu erleichtern.

Anmerkungen

GitHub unterstützt die :word:Syntax in Commits, Readme-Dateien usw. siehe gist (von rxaviers), wenn die Verwendung von em dort von Interesse ist.

Und für fast überall sonst kann Dezimal oder Hexadezimal für moderne Browser verwendet werden. Der Spickzettel von w3schools ist sehr praktisch , besonders wenn die Verwendung von CSS ::beforeoder Pseudoelementen::after mit Symbolen eher Ihr Stil ist.

Bonuspunkte?

Nur für den Fall, dass sich jemand gefragt hat, wie Bilder und andere Links in einer Überschrift in eine id...

- [Imaged](#alt-textbadge__examplehttpsexamplecom-to-somewhere)


## [![Alt Text][badge__example]](https://example.com) To Somewhere


[badge__example]:
  https://img.shields.io/badge/Left-Right-success.svg?labelColor=brown&logo=stackexchange
  "Eeak a mouse!"

Vorsichtsmaßnahmen

Das MarkDown-Rendering unterscheidet sich von Ort zu Ort, sodass Dinge wie ...

## methodName([options]) => <code>Promise</code>

... auf GitHub wird ein Element mit idwie ...

id="methodnameoptions--promise"

... wo als Vanille- Hygiene id...

id="methodnameoptions-codepromisecode"

... bedeutet, dass das Schreiben oder Kompilieren von MarkDown-Dateien aus Vorlagen entweder eine gezielte Art des Slugifeing erfordert oder das Hinzufügen von Konfigurationen und Skriptlogik für die verschiedenen cleveren Methoden, mit denen der Text der Überschrift bereinigt werden soll.


9

Universelle Lösungen

Diese Frage scheint je nach Abschriftenimplementierung eine andere Antwort zu haben.
In der offiziellen Markdown-Dokumentation wird zu diesem Thema nichts gesagt.
In solchen Fällen und wenn Sie eine tragbare Lösung wünschen, können Sie HTML verwenden.

Definieren Sie vor einem Header oder in derselben Headerzeile eine ID mithilfe eines HTML-Tags.
Beispiel: <a id="Chapter1"></a>
Sie sehen dies in Ihrem Code, jedoch nicht im gerenderten Dokument.

Vollständiges Beispiel:

Ein vollständiges Beispiel (online und bearbeitbar) finden Sie hier .

## Content

* [Chapter 1](#Chapter1)
* [Chapter 2](#Chapter2)

<div id="Chapter1"></div>
## Chapter 1

Some text here.  
Some text here.
Some text here.

## Chapter 2 <span id="Chapter2"><span>

Some text here.  
Some text here.
Some text here.

Um dieses Beispiel zu testen, müssen Sie zwischen der Inhaltsliste und dem ersten Kapitel zusätzlichen Platz einfügen oder die Fensterhöhe verringern.
Verwenden Sie auch keine Leerzeichen im Namen der IDs.


Äh ... schien nett zu sein. Versuchte es, zwei Probleme: (1). ## Chapter 1braucht eine offene Linie darüber. (2). Der Link funktioniert nicht ...
musicformellons

Ah, es funktioniert nicht in dem von mir verwendeten Intellij Markdown Plugin. funktioniert aber im Macdown Markup Editor.
musicformellons

Immer noch auf Github getestet: Eine offene Zeile über dem Header ist erforderlich, funktioniert aber.
musicformellons

@musicformellons können Sie es bitte ohne die Eröffnungszeile versuchen, aber das Span-Tag richtig schließen? <br><span id="Chapter1"><span>
ePi272314

Ja, es funktioniert!
musicformellons

7

In der Markdown-Spezifikation gibt es keine solche Richtlinie. Es tut uns leid.


Oh oh! Wissen Sie, ob MultiMarkdown oder Textile dies unterstützen? Ich dachte daran, für alle meine Unterlagen auf MD zu migrieren, aber dies war ein Deal Breaker. Danke für die Hilfe!
Rezeptausschluss

5
Was meinst du mit "Richtlinie"? Andere Lösungen für genau das Problem wurden hier veröffentlicht.
Zelphir Kaltstahl

4

Gitlab verwendet GitLab Flavored Markdown (GFM)

Hier "erhalten alle von Markdown gerenderten Header automatisch IDs"

Man kann die Maus benutzen, um:

  • Bewegen Sie die Maus über die Kopfzeile
  • Bewegen Sie die Maus über den Hover-Selektor, der von der Kopfzeile links sichtbar wird
  • Kopieren und speichern Sie den Link mit der rechten Maustaste

    Zum Beispiel in der Datei README.md habe ich einen Header:

## series expansion formula of the Boettcher function

welches einen Link gibt:

https://gitlab.com/adammajewski/parameter_external_angle/blob/master/README.md#series-expansion-formula-of-the-boettcher-function

Das Präfix kann entfernt werden, so dass der Link hier einfach ist

file#header

was hier bedeutet:

README.md#series-expansion-formula-of-the-boettcher-function

Jetzt kann es verwendet werden als:

[series expansion formula of the Boettcher function](README.md#series-expansion-formula-of-the-boettcher-function)

Man kann es auch manuell machen: Ersetzen Sie Leerzeichen durch Bindestriche.

Live Beispiel ist hier


1

Mit kramdown scheint dies gut zu funktionieren:

[I want this to link to foo](#foo)
....
....
{: id="foo"}
### Foo are you?

Ich sehe, dass es erwähnt wurde

[foo][#foo]
....
#Foo

funktioniert effizient, aber ersteres ist möglicherweise eine gute Alternative für Elemente neben Überschriften oder Überschriften mit mehreren Wörtern.


1

Da MultiMarkdown als Option in Kommentaren erwähnt wurde.

In MultiMarkdown ist die Syntax für einen internen Link einfach.

Geben Sie für jede Überschrift im Dokument einfach den Überschriftennamen in diesem Format [heading][]an, um einen internen Link zu erstellen.

Lesen Sie hier mehr: MultiMarkdown-5 Querverweise .

Querverweise

Eine häufig nachgefragte Funktion war die Möglichkeit, dass Markdown Links innerhalb eines Dokuments genauso einfach wie externe Links automatisch verarbeitet. Zu diesem Zweck habe ich die Möglichkeit hinzugefügt, [Some Text] [] als Querverbindung zu interpretieren, wenn eine Überschrift mit dem Namen "Some Text" vorhanden ist.

Als Beispiel führt Sie [Metadaten] [] zu # Metadaten (oder zu beliebigen Metadaten, Metadaten, Metadaten, Metadaten, Metadaten).

Alternativ können Sie ein optionales Etikett Ihrer Wahl hinzufügen, um Fälle zu unterscheiden, in denen mehrere Überschriften denselben Titel haben:

### Übersicht [MultiMarkdownOverview] ##

Auf diese Weise können Sie mit [MultiMarkdownOverview] speziell auf diesen Abschnitt verweisen und nicht auf einen anderen Abschnitt mit dem Namen Übersicht. Dies funktioniert mit atx- oder settext-artigen Headern.

Wenn Sie bereits einen Anker mit derselben ID definiert haben, die von einem Header verwendet wird, hat der definierte Anker Vorrang.

Zusätzlich zu den Überschriften im Dokument können Sie Beschriftungen für Bilder und Tabellen bereitstellen, die dann auch für Querverweise verwendet werden können.


0

Noch ein paar <a name="">Drehungen:

<a id="a-link"></a> Title
------

#### <a id="a-link"></a> Title (when you wanna control the h{N} with #'s)

0

Zusätzlich zu den obigen Antworten

Beim Festlegen der Option number_sections: trueim YAML-Header:

number_sections: TRUE

RMarkdown nummeriert Ihre Abschnitte automatisch.

Um auf diese automatisch nummerierten Abschnitte zu verweisen, fügen Sie einfach Folgendes in Ihre R Markdown-Datei ein:

[My Section]

Wo My Sectionist der Name des Abschnitts?

Dies scheint unabhängig von der Abschnittsebene zu funktionieren:

# My section

## My section

### My section

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.