Verknüpfung zu einer Überschrift innerhalb eines Beitrags oder Themas

[Discourse]

Diese Anleitung erklärt, wie man direkt auf eine Überschrift in einem Discourse-Beitrag oder -Thema verlinkt, sodass Benutzer lange Beiträge effizient navigieren können.

Erforderliches Benutzerniveau: Alle Benutzer

Das Hinzufügen von Überschriften innerhalb langer Beiträge kann den Inhalt lesbarer machen und es Benutzern ermöglichen, direkt auf bestimmte Abschnitte zu verlinken. Dies kann besonders nützlich für die Navigation in umfangreichen Diskussionen und Dokumentationen sein.

Zusammenfassung

Diese Anleitung behandelt:

• Erstellen von Überschriften mit Markdown
• Direktes Verlinken auf bestimmte Überschriften in einem Beitrag

Erstellen von Überschriften mit Markdown

Um eine Überschrift in Markdown zu erstellen, setzen Sie ein oder mehrere #-Zeichen vor eine Textzeile. Die Anzahl der #-Zeichen entspricht der Überschriftenebene. Hier sind einige Beispiele:

## Dies ist eine Überschrift der Ebene 2
Hier folgt ein kurzer Absatz.

### Dies ist eine Überschrift der Ebene 3
Hier folgt ein weiterer kurzer Absatz.

Wenn dies gerendert wird, sieht es wie folgt aus:

---

Dies ist eine Überschrift der Ebene 2

Hier folgt ein kurzer Absatz.

Dies ist eine Überschrift der Ebene 3

Hier folgt ein weiterer kurzer Absatz.

---

Direktes Verlinken auf eine Überschrift

Um einen direkten Link zu einer Überschrift innerhalb eines Beitrags zu teilen:

1. Bewegen Sie den Mauszeiger über die Überschrift, um ein Link-Symbol daneben anzuzeigen: .
2. Klicken Sie auf das Link-Symbol, um die URL in der Adressleiste Ihres Browsers mit dem direkten Link zu dieser Überschrift zu aktualisieren.
3. Kopieren Sie die aktualisierte URL aus der Adressleiste, um sie mit anderen zu teilen.

Das Link-Symbol wird nur auf Desktop-Geräten (nicht für Touchscreens) angezeigt, wenn Sie mit der Maus über eine Überschrift fahren. Auf Touch- und Mobilgeräten sind die Anker-Links zwar auf der Seite vorhanden, aber nicht sichtbar.

Verstehen von Überschriften-Anker-URLs

Wenn Sie auf das Link-Symbol einer Überschrift klicken, wird die URL in Ihrer Adressleiste mit einem Fragment im Format aktualisiert:

#p-{postId}-{slugified-heading}-{number}

Zum Beispiel würde eine Überschrift „Erste Schritte“ in Beitrag 12345 ein URL-Fragment wie #p-12345-getting-started-1 erzeugen. Die Zahl am Ende ist ein sequenzieller Zähler, der auf der Position der Überschrift im Beitrag basiert.

Best Practices

• Verwenden Sie beschreibende Überschriften, um Inhalte klar zusammenzufassen.
• Strukturieren Sie Ihren Beitrag bei Bedarf mit hierarchischen Überschriften.
• Stellen Sie sicher, dass Überschriften konsistent und logisch sind, um die Lesbarkeit zu verbessern.
• Beachten Sie, dass das Bearbeiten von Überschriftentext oder das Neuanordnen von Überschriften deren Anker-URLs ändert, was bestehende Links ungültig machen kann.

FAQs

Kann ich auf einen beliebigen Teil eines Beitrags verlinken?
Sie können auf jede Überschrift verlinken, die ordnungsgemäß in Markdown formatiert ist, solange sie sich nicht innerhalb eines Blockzitats oder Zitatblocks befindet. Überschriften innerhalb dieser Blöcke generieren keine Anker-Links.

Funktionieren Links zu Überschriften über verschiedene Beiträge hinweg?
Ja! Diese Links leiten beim Verlinken aus anderen Themen oder beim Teilen an anderer Stelle zum entsprechenden Header im Beitrag weiter.

Zusätzliche Ressourcen

• Unterstützte Formatierung in Beiträgen (Markdown, BBCode und HTML)
• Interaktiver Markdown-Leitfaden

[one1]

Ich sehe die Link-Icons weder auf dieser Seite noch auf meiner eigenen. Nicht in FF oder in Chrome.

Hat sich etwas geändert?

[pfaffman (Jay Pfaffman)]

Sie müssen mit der Maus über die Überschrift fahren, damit diese angezeigt wird:

[one1]

Ich fahre mit der Maus darüber und sehe nichts.

Es scheint zwar etwas da zu sein, aber es wird kein Symbol angezeigt.

Eine Anschlussfrage …

Ich gehe davon aus, dass der Link kaputt geht, wenn man den Text der Überschrift ändert.

ERGÄNZUNG: Nicht nur der Anker ändert sich, wenn sich der Titel ändert, sondern auch das numerische Suffix der Überschrift, wenn man eine weitere Überschrift vor bestehende Überschriften einfügt. Das erscheint so anfällig, dass es nutzlos ist.

Die einzig sichere Problemumgehung wäre, die Überschriften in HTML-a-Tags einzuschließen und ihnen eine ID zu geben, richtig?

Ergänzung: Ich habe sowohl versucht, den Überschriftstext in a-Tags einzuschließen als auch nur leere Tags vor den Überschriftstext zu setzen. Keine der beiden IDs funktionierte. Ich habe es auch mit spans stattdessen versucht, mit dem gleichen Misserfolg.

[one1]

Ja, ich kann es im DOM als before finden:

Ich bin auf Windows 11.

Der einzige Weg, wie ich das Link-Symbol erscheinen lassen kann, ist, den Link zu kopieren und dann diesen Link (mit dem # und der ID) in einen neuen Tab zu öffnen und dorthin zu navigieren. Dann wird das Link-Symbol dauerhaft angezeigt (ohne Hover), aber keines der anderen Link-Symbole erscheint beim Hovern.

[one1]

Darf ich diesen Thread hochschieben (bump)? Ich frage mich, ob ich etwas Offensichtliches über das Verlinken innerhalb eines Beitrags übersehe.

[markschmucker (Mark S)]

@one1

Ich fahre mit der Maus darüber und sehe nichts.

Es scheint dort etwas zu sein, aber es wird kein Symbol angezeigt.

Ich habe das gleiche Problem. Das Symbol ist da, aber seine Deckkraft ist auf Null gesetzt, sodass es nicht sichtbar ist.

.cooked h1 a.anchor, .cooked h2 a.anchor, .cooked h3 a.anchor, .cooked h4 a.anchor, .cooked h5 a.anchor, .cooked h6 a.anchor, .d-editor-preview h1 a.anchor, .d-editor-preview h2 a.anchor, .d-editor-preview h3 a.anchor, .d-editor-preview h4 a.anchor, .d-editor-preview h5 a.anchor, .d-editor-preview h6 a.anchor

Specificity: (0,2,2)

{

opacity: 0;

transition: opacity .25s;

}

Ich kann die Symbole auch im OP nicht sehen, was benutzerdefinierte Stile auf meiner Instanz ausschließt.

Ich benutze Chrome.

[markschmucker (Mark S)]

Als separates Problem stelle ich fest, dass der Link, der vom (unsichtbaren) Icon bereitgestellt wird, aus demselben Thema heraus nicht funktioniert. Wenn das Icon mir Folgendes gibt:

https://forum.example.com/t/testing-anchors/63647#p-311503-heading-1

Muss ich meinen Link erstellen, indem ich nur #p-311503-heading-1 verwende, nicht die vollständige URL. Die vollständige URL funktioniert, wenn ich sie in den Browser einfüge.