 |
Zusammenfassung | DiscoTOC ermöglicht es Ihnen, mit einem Klick ein interaktives Inhaltsverzeichnis für Ihre Themen zu erstellen! |
 |
Vorschau | Vorschau im Discourse Theme Creator |
 |
Repository-Link | https://github.com/discourse/DiscoTOC |
 |
Neu bei Discourse-Themen? | Anfängerleitfaden zur Verwendung von Discourse-Themen |
Dieses Theme-Komponente installieren
Beispiele
Desktop
Mobile
Funktionen
toc = Inhaltsverzeichnis
-
Erstellt automatisch das gesamte Inhaltsverzeichnis über einen Button im Zahnradmenü des Editors
-
Das Inhaltsverzeichnis bleibt immer auf dem Bildschirm – es scrollt mit dem Inhalt wie das Widget für den Themenfortschritt
-
Wenn Sie durch Abschnitte im Thema scrollen, wird das aktive Element im Inhaltsverzeichnis aktiviert (blaue Hervorhebung)
-
Fügt ID-Attribute zu Überschriften hinzu (Sie können von einem anderen Thema/Beitrag auf einen bestimmten Abschnitt verlinken)
-
Ein Klick auf einen Link im Inhaltsverzeichnis weist den Browser an, zum relevanten Abschnitt zu navigieren (sanftes Scrollen)
-
Fügt neben jeder Überschrift einen kopierbaren Link hinzu (falls Sie darauf verlinken möchten)
-
RTL-Unterstützung
-
Die Farben basieren auf Ihrem aktuellen aktiven Farbpaletten-Design
Wie funktioniert es?
Kurz gesagt, sucht es nach Überschriften in Themen, die so markiert sind, dass sie ein Inhaltsverzeichnis haben (über den Editor-Button), und wenn das aktuelle Thema markiert ist, nimmt es alle Überschriften und fügt sie in das Inhaltsverzeichnis ein (verschachtelt nach Überschriftenleveln) – das bedeutet, dass Ihr Markdown syntaktisch korrekt sein muss.
# Überschrift 1
## Überschrift 2
### Überschrift 3
#### Überschrift 4
##### Überschrift 5
###### Überschrift 6
Sie können frei zwischen den Überschriftenleveln hin und her wechseln, aber die Reihenfolge muss korrekt sein.
# Überschrift 2
## Überschrift 3
## Überschrift 3
### Überschrift 4
## Überschrift 3
# Überschrift 2
usw...
Damit die Links im Inhaltsverzeichnis funktionieren, müssen Überschriften ID-Attribute haben. Die Komponente prüft, ob die Überschriften bereits IDs haben, und wenn ja, werden diese respektiert. Das ist praktisch, falls Sie jemals manuell ein Inhaltsverzeichnis erstellt haben.
Falls die Überschriften keine IDs haben, generiert die Komponente eine ID für jede Überschrift basierend auf ihrem Text (unerwünschte Zeichen werden entfernt).
Sobald all das erledigt ist, wird außerdem ein Link neben jeder Überschrift hinzugefügt, der direkt zu diesem Abschnitt führt:
Einstellungen
| Name | Beschreibung |
|---|---|
| Mindestvertrauenslevel zum Erstellen eines TOC | Das Mindestvertrauenslevel, das ein Benutzer haben muss, um den TOC-Button im Editor zu sehen |
| composer toc text | Text, der oben im Vorschaufenster des Editors erscheint, um anzuzeigen, dass das Thema ein Inhaltsverzeichnis haben wird |
| auto TOC categories | TOC automatisch in diesen Kategorien für Themen aktivieren |
| auto TOC tags | TOC automatisch für Themen mit diesen Tags aktivieren |
| TOC min heading | Mindestanzahl von Überschriften in einem Thema, damit das Inhaltsverzeichnis angezeigt wird |
Übersetzungen
| Übersetzung | Standard |
|---|---|
| table_of_contents | Inhaltsverzeichnis |
| insert_table_of_contents | Inhaltsverzeichnis einfügen |
| jump_bottom | Zum Ende springen |
| toggle_toc.show_timeline | Zeitleiste |
| toggle_toc.show_toc | Inhalt |
Das Theme enthält drei Zeichenfolgen, die Sie übersetzen oder ändern können.
table_of_contents: "Inhaltsverzeichnis"
Dies wird für den Button verwendet, der das Inhaltsverzeichnis auf mobilen Geräten öffnet.
insert_table_of_contents: "Inhaltsverzeichnis einfügen"
Dies wird als Text für den TOC-Button im Zahnradmenü des Editors verwendet.
topic_will_contain_a_table_of_contents: "Dieses Thema wird ein Inhaltsverzeichnis enthalten"
Dies ist der Text, der in der Editor-Vorschau erscheint, um anzuzeigen, dass ein TOC für das Thema generiert wird.
Wie erstelle ich ein TOC?
- Schreiben Sie ein Thema mit syntaktisch korrekten Überschriften.
- Klicken Sie im Zahnradmenü auf den TOC-Button (erscheint nur beim Erstellen eines regulären Themas – Antworten und PMs werden ignoriert).
- Profitieren Sie.
Was passiert mit dem Widget für den Themenfortschritt, wenn ein Thema ein TOC hat?
Wie Sie wahrscheinlich erraten können, gibt es keinen Platz, um beides gleichzeitig anzuzeigen. Daher funktioniert diese Komponente wie folgt:
In einem Thema mit TOC wird das Widget für den Themenfortschritt ausgeblendet, solange der erste Beitrag auf dem Bildschirm ist, und stattdessen sehen Sie das TOC.
Sobald Sie über den ersten Beitrag hinaus scrollen, scrollt das TOC nicht mehr mit Ihnen mit, und stattdessen wird das Widget für den Themenfortschritt angezeigt, während Sie Antworten lesen.
Also erhalten erste Beiträge das TOC, und nachfolgende Beiträge das reguläre Widget für den Themenfortschritt.
Dies funktioniert sowohl auf Desktop als auch auf mobilen Geräten.
Gibt es Nachteile bei der Verwendung dieser Komponente?
Mir ist nichts bekannt, alle Änderungen erfolgen auf der Client-Seite. Sie können die Komponente also einfach entfernen, und Ihre Beiträge kehren zum Zustand zurück, wie sie vor der Installation waren.
Einschränkungen
Diese Komponente geht von dem standardmäßigen Themenlayout aus. Daher funktioniert sie nicht mit Themen, die dieses Layout ändern, wie beispielsweise das Vincent-Theme. Die Unterstützung für beliebte Themen, die das Layout ändern, wird später in Form von Komponenteneinstellungen hinzukommen.
Credits
Ich habe mit Greg Frankos tocify.js Bibliothek begonnen. Allerdings scheint es, als ob sie seit einiger Zeit nicht mehr aktualisiert wurde, daher ist dies im Wesentlichen ein Hard-Fork, der viele unnötige Funktionen entfernt, den Rest für Discourse integriert und gestaltet.
Es gibt also keine externen Anfragen, und die Gesamtgröße beträgt ~ 4kb gzip.
Großer Dank an @erlend_sh für viele wertvolle Rückmeldungen und an @david für seine Hilfe bei den Übersetzungen.
Von uns gehostet? Theme-Komponenten können auf unseren Pro-, Business- und Enterprise-Plänen verwendet werden.
Danke!
