@giscusgiscus

giscus

Een comment-systeem mogelijk gemaakt door GitHub Discussions. Laat bezoekers opmerkingen en reacties achterlaten op je website via GitHub! Geïnspireerd doorutterances.

Opmerking
giscus is nog volop in ontwikkeling. GitHub is ook nog steeds actief bezig met het ontwikkelen van Discussions en de bijbehorende API. Sommige kenmerken van giscus kunnen dus in de loop van de tijd breken of veranderen.

Hoe het werkt

Wanneer giscus laadt, wordt de GitHub Discussions search API gebruikt om de Discussion die bij de pagina hoort te vinden. Dit is gebaseerd op een gekozen mapping tussen de pagina en de Discussion (bv. URL, pathname, <title>...) Als er geen overeenkomende Discussion gevonden kan worden, zal de giscus bot er automatisch eentje maken.

Om een opmerking achter te laten, moeten gebruikers de giscus app authorizeren om namens hen te posten met behulp van de GitHub OAuth-stroom. Als alternatief kunnen bezoekers rechtstreeks reageren op de GitHub-discussie. U kunt de opmerkingen op GitHub modereren.

Configuratie

Taal

Kies de taal waarin giscus wordt weergegeven. Kunt u uw taal niet vinden? Draag bij aan een lokalisatie.

Repository

Kies de repository waarmee giscus verbinding zal maken. Zorg ervoor dat:

  1. De repository openbaar is, anders kunnen bezoekers de discussie niet bekijken.
  2. De giscus app geïnstalleerd is, anders kunnen bezoekers geen commentaar geven en reageren.
  3. De Discussions feature ingeschakeld is door het in te schakelen voor je repository.

Een openbaar GitHub repository. Aan deze repo worden de discussies gelinkt.

Pagina ↔️ Discussies linken

Kies de toewijzing tussen de insluitpagina en de ingesloten discussie.

giscus zoekt naar een discussie waarvan de titel de pagina's pathname URL component bevat.

giscus zoekt naar een discussie waarvan de titel de pagina's URL bevat.

giscus zoekt naar een discussie waarvan de titel de pagina's <title> HTML tag bevat.

giscus zoekt naar een discussie waarvan de titel de pagina's <meta property="og:title"> HTML tag bevat.

giscus zoekt naar een discussie waarvan de titel een specifieke term bevat.

giscus laadt een specifieke discussie op nummer. Deze optie biedt geen ondersteuning voor het automatisch aanmaken van discussies.

Vermijd mismatches vanwege de vage zoekmethode van GitHub wanneer er meerdere discussies zijn met vergelijkbare titels. Zie de documentatie voor meer details.

Discussiecategorie

Kies de discussiecategorie waar nieuwe discussies worden gemaakt. Het wordt aanbevolen om een categorie met het type Announcements te gebruiken, zodat nieuwe discussies alleen kunnen worden aangemaakt door beheerders en giscus.

Bij het zoeken naar een overeenkomende discussie zoekt giscus alleen in deze categorie.

Functies

Kies of specifieke functies moeten worden ingeschakeld.

De reacties op de hoofdpost van de discussie worden vóór de opmerkingen getoond.

Metadata van discussies worden periodiek naar het bovenliggende venster (de insluitpagina) gestuurd. Schakel voor demonstratie deze optie in en open de console van uw browser op deze pagina. Zie de documentatie voor meer details.

Het invoervak voor opmerkingen wordt boven de opmerkingen geplaatst, zodat gebruikers een opmerking kunnen achterlaten zonder naar de onderkant van de discussie te hoeven scrollen.

Het laden van de opmerkingen wordt uitgesteld totdat de gebruiker in de buurt van de opmerkingencontainer scrolt. Dit doe je door loading="lazy" toe te voegen aan het <iframe> element.

Thema

Kies een thema dat bij je website past. Kun je er geen vinden die dat doet? Draag bij aan een nieuw thema.

Giscus inschakelen

Add the following <script> tag to your website's template where you want the comments to appear. If an element with the class giscus exists, the comments will be placed there instead.

U heeft uw repository en/of categorie niet geconfigureerd. De waarden voor die velden worden pas weergegeven als u ze invult.
<script src="https://giscus.app/client.js"
        data-repo="[VUL REPO HIER IN]"
        data-repo-id="[VUL REPO ID HIER IN]"
        data-category="[VUL CATEGORIE NAAM HIER IN]"
        data-category-id="[VUL CATEGORY ID HIER IN]"
        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="nl"
        crossorigin="anonymous"
        async>
</script>

You can customize the container layout using the .giscus and .giscus-frame selectors from the embedding page.

Als je giscus gebruikt, overweeg dan giscus een ster 🌟 te geven op GitHub en de giscus topic aan je repository toe te voegen! 🎉

Geavanceerd gebruik

Je kan aanvullende configuraties toevoegen (bv. specifieke herkomst toestaan) door de geavanceerde gebruiksgids te volgen.

Om giscus te gebruiken met React, Vue of Svelte, bekijk de giscus component bibliotheek.

Migreren

Als je eerder andere systemen hebt gebruikt die GitHub Issues gebruiken (bv. utterances, gitalk), kan je je bestaande issues omvormen naar discussions. Zorg er na de conversie voor dat de toewijzing tussen de titels van de discussie en de pagina's correct is, dan zal giscus de discussies automatisch gebruiken.

Sites die giscus gebruiken

Bijdragen

Bekijk CONTRIBUTING.md

Probeer het uit 👇👇👇

Powered by Vercel