Ever wondered how useful it could be if we could embed GitHub Discussions to our blogs, documentation or anywhere we like Well I Found an application that does this seamlessly, In this blog we'll learn to use Gicus!
Introduction
A comments system powered by GitHub Discussions. Let visitors leave comments and reactions on your website via GitHub! Heavily inspired by utterances.
Features
Open-source. ๐
No tracking, no ads, always free. ๐ก ๐ซ
No database is needed. All data is stored in GitHub Discussions.
Supports custom themes! ๐
Supports multiple languages. ๐
Extensively configurable. ๐ง
Automatically fetches new comments and edits from GitHub. ๐ Can be self-hosted! ๐คณ
How it works
When giscus loads, the GitHub Discussions search API is used to find the Discussion associated with the page based on a chosen mapping (URL, pathname
, <title>
, etc.). If a matching discussion cannot be found, the giscus bot will automatically create a discussion the first time someone leaves a comment or reaction.
To comment, visitors must authorize the giscus app to post on their behalf using the GitHub OAuth flow. Alternatively, visitors can comment on the GitHub Discussion directly. You can moderate the comments on GitHub.
Requirements
The repository is public, otherwise, visitors will not be able to view the discussion.
The giscus app is installed, otherwise, visitors will not be able to comment and react.
The Discussions feature is turned on by enabling it for your repository.
Meeting Requirements
enable Discussions for your repo
ensure that your repo is public
install Gicus app & configure
Configure
choose language and enter repository in (username/reponame) format is above requirements are satisfied you'd see a green tick
Choose the mapping between the embedding page and the embedded discussion, you can play around but you can proceed by choosing 2nd option
Choose the discussion category where new discussions will be created. It is recommended to use a category with the Announcements type so that new discussions can only be created by maintainers and Gicus.
- choose from a variety of themes
- and you are done, it'll generate a script that can be used to embed discussions !!!
- you can add this script within <body> tag
Output
this is how the light-contrast theme looks