@giscusgiscus

giscus

Ein Kommentar-System möglich gemacht durch GitHub Diskussionen. Lass Besucher Kommentare und Reaktionen auf deiner Webseite hinterlassen durch GitHub! Stark inspiriert durch utterances.

Hinweis:
giscus ist noch immer unter Entwicklung. GitHub ist auch aktiv an der Weiterentwicklung Ihrer Diskussionen und deren API beschäftigt. Darum können einige Funktionen von giscus in Zukunft ändern oder Fehler auftreten.

Wie es funktioniert

Wenn giscus lädt, wird die GitHub Diskussionen Such-API verwendet um die Diskussion, welche mit der Seite durch ein bestimmtes Mapping (URL, <pathname>, <title>, etc.) assoziert wird, zu finden. Wenn eine treffende Diskussion nicht gefunden werden kann, erstellt der giscus Bot automatisch eine neue Diskussion, wenn jemand zum ersten Mal einen Kommentar oder eine Reaktion hinterlässt.

Um zu kommentieren, müssen Besucher die giscus App autorisieren in ihrem Namen zu posten, mithilfe des GitHub OAuth flows. Alternativ können Besucher direkt auf der Diskussion kommentieren. Du kannst die Kommentare auf GitHub moderieren.

Konfiguration

Sprache

Wähle die Sprache in welcher giscus angezeigt werden soll. Du kannst deine Sprache nicht finden? Mach mit durch das Übermitteln einer Übersetzung.

Repository

Wähle das Repository zu welches sich giscus verbinden soll. Stelle sicher dass:

  1. Das Repository öffentlich ist, da Besucher sonnst nicht die Diskussionen sehen können.
  2. Die giscus App installiert ist, da Besucher sonst nicht kommentieren und reagieren können.
  3. Das Diskussions-Feature aktiviert ist indem du es für dein Repository aktivierst.

Eine öffentliches GitHub-Repository. Dieses Repository wird zum Verlinken der Diskussionen verwendet.

Seite ↔️ Diskussionen Mapping

Wähle das Mapping zwischen der einbettenden Seite und der eingebetteten Diskussion.

giscus wird nach Diskussionen suchen, welche die pathname URL-Komponente der Seite im Titel enthalten

giscus wird nach Discussionen suchen, welche die URL der Seite im Titel enthalten.

giscus wird nach Discussionen suchen, welche die <title> Komponente der Seite im Titel enthalten.

giscus wird nach Discussionen suchen, welche den <meta property="og:title"> HTML tag im Titel enthalten.

giscus wird nach Discussionen suchen, welche einen bestimmten Begriff im Titel enthalten.

giscus wird eine bestimmte Diskussion, basierend auf einer Nummer laden. Diese Option unterstützt nicht die automatische Erstellung von Diskussionen.

Vermeiden Sie Diskrepanzen aufgrund der unscharfen Suchmethode von GitHub, wenn es mehrere Diskussionen mit ähnlichen Titeln gibt. Siehe die Dokumentation für weitere Details.

Kategorie der Diskussion

Wähle die Kategorien aus, in welcher neue Diskussionen erstellt werden sollen. Es wird empfohlen, eine Kategorie vom Typ Announcements zu verwenden, da so nur Bearbeiter des Repository und giscus neue Diskussionen erstellen können.

Wenn giscus nach einer treffenden Diskussion sucht, wird es nur in dieser Kategorie danach suchen.

Funktionen

Wähle, ob bestimmte Funktionen verfügbar sein sollen.

Die Reaktionen für den eigentlichen Post der Diskussion werden vor den Kommentaren angezeigt.

Metadaten der Diskussion werden regelmässig zur eigentlichen Seite (Einbettende Seite) gesendet. Zu Demonstrationszwecken, aktiviere diese Option und öffne die Konsole deines Browsers auf dieser Seite. Siehe die Dokumentation für weitere Details.

Das Kommentareingabefeld wird über den Kommentaren platziert, sodass Benutzer einen Kommentar hinterlassen können, ohne zum Ende der Diskussion zu scrollen.

Das Laden von Kommentaren wird verzögert, bis der Benutzer in die Nähe des Kommentarcontainers scrollt. Dies geschieht durch Hinzufügen von loading="lazy" zum <iframe> Element.

Theme

Wähle ein Theme, welches zu deiner Webseite passt. Kannst keines finden dass dies tut? Steuere ein neues Theme bei.

giscus aktivieren

Füge den folgenden <script> tag zu der Vorlage deiner Webseite hinzu, in welcher du die Kommentare anzeigen möchtest. Wenn ein Element mit dem Namen <giscus> existiert werden die Kommentare an dieser Stelle platziert.

Sie haben Ihr Repository und/oder Ihre Kategorie nicht konfiguriert. Die Werte für diese Felder werden erst angezeigt, wenn Sie sie ausgefüllt haben.
<script src="https://giscus.app/client.js"
        data-repo="[GIB REPO NAMEN HIER EIN]"
        data-repo-id="[GIB REPO ID HIER EIN]"
        data-category="[GIB KATEGORIE NAMEN HIER EIN]"
        data-category-id="[GIB KATEGORIE ID HIER EIN]"
        data-mapping="pathname"
        data-strict="0"
        data-reactions-enabled="1"
        data-emit-metadata="0"
        data-input-position="bottom"
        data-theme="preferred_color_scheme"
        data-lang="de"
        crossorigin="anonymous"
        async>
</script>

Du kannst das Container-Layout mit dem .giscus und .giscus-frame Selectoren von der einbettenden Seite ändern.

Wenn du giscus verwendest, überlege dir, der Repository auf Github einen Stern 🌟 zu geben und den giscus Topic deiner Repository hinzuzufügen! 🎉

Fortgeschrittene Anwendung

Du kannst zusätzliche Konfigurationen (z.B. das Erlauben verschiedener Quellen) einrichten, in dem du den fortgeschrittenen Benutzerguide liest.

Um giscus mit React, Vue oder Svelte zu verwenden, schau dir die giscus Komponenten-Bücherei an.

Migration

Wenn du vorher andere Systeme verwendet hast, welche GitHub Issues verwendeten (z.B. utterances, gitalk, etc.) kannst du existierende Issues zu Diskussionen konvertieren. Nach der Konvertierung musst du nur sicherstellen, dass das Mapping zwischen den Titeln der Diskussionen und den Seiten korrekt ist, dann sollte giscus automatisch die Diskussionen verwenden.

Seiten, die giscus verwenden

Mitmachen

Siehe CONTRIBUTING.md

Probiere es aus 👇👇👇

Powered by Vercel