Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add giscus #484

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Add giscus #484

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
cb0e708
Add giscus
copyrat90 Jan 22, 2025
aa5f3b0
Fix giscus theme example comment
copyrat90 Jan 25, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 25 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -224,6 +224,31 @@ comments:
label: # OPTIONAL: Adds an issue label in the issue
```

#### Giscus

[Giscus](https://giscus.app/) is another open source alternative linked to one's GitHub account.
It stores the comments as GitHub discussions on a repository for each page.

Install the giscus [app](https://github.com/apps/giscus) to your repo.
After installing, add your info in the `_config.yml`:

```yaml
comments:
giscus: # Enable by filling below information. For more info, go to https://giscus.app
repo: # Your public comments repository (e.g. owner/repo)
repo-id: # Your repo id, go to https://giscus.app to check it
category: # Category to search discussions. When removed, discussions will be searched in all categories
category-id: # Your category id, go to https://giscus.app to check it
mapping: # Discussion mapping
term: # OPTIONAL: some mappings require specific term, go to https://giscus.app to check it
strict: 1 # OPTIONAL: Avoid mismatches on similar titles
reactions-enabled: 0 # OPTIONAL: Disable reactions
emit-metadata: 1 # OPTIONAL: Emit discussion metadata
input-position: top # OPTIONAL: Place the comment box above the comments
theme: # OPTIONAL: Take the `color_theme` by default, or set a custom one like dark_dimmed
lang: # OPTIONAL: Choose the language. "en" is used by default
```

### Math typesetting with KateX

When KateX is set in `_config.yml`:
Expand Down
6 changes: 6 additions & 0 deletions _config.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,12 @@ comments:
utterances: # Enable by filling below information. For more info, go to https://utteranc.es
repo: # your public comments repository (e.g. owner/repo)
issue-term: # Issue term (e.g. "comment" consider issues with this word in the title as comments)
giscus: # Enable by filling below information. For more info, go to https://giscus.app
repo: # Your public comments repository (e.g. owner/repo)
repo-id: # Your repo id, go to https://giscus.app to check it
category: # Category to search discussions. When removed, discussions will be searched in all categories.
category-id: # Your category id, go to https://giscus.app to check it
mapping: # Discussion mapping

# PAGINATION
paginate: 5
Expand Down
5 changes: 5 additions & 0 deletions _includes/blog/post_footer.liquid
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,11 @@
{% include blog/post_nav.liquid %}
{% endif %}

<!-- Giscus -->
{% if site.comments.giscus.repo and site.comments.giscus.repo-id and site.comments.giscus.category-id and site.comments.giscus.mapping %}
{% include social/giscus.liquid %}
{% endif %}

<!--Utterances-->
{% if site.comments.utterances.repo and site.comments.utterances.issue-term %}
{% include social/utterances.liquid %}
Expand Down
17 changes: 17 additions & 0 deletions _includes/social/giscus.liquid
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
<script src="https://giscus.app/client.js"
data-repo="{{ site.comments.giscus.repo }}"
data-repo-id="{{ site.comments.giscus.repo-id }}"
{% if site.comments.giscus.category %}data-category="{{ site.comments.giscus.category }}"{% endif %}
data-category-id="{{ site.comments.giscus.category-id }}"
data-mapping="{{ site.comments.giscus.mapping }}"
{% if site.comments.giscus.term %}data-term="{{ site.comments.giscus.term }}"{% endif %}
data-strict="{% if site.comments.giscus.strict %}{{ site.comments.giscus.strict }}{% else %}0{% endif %}"
data-reactions-enabled="{% if site.comments.giscus.reactions-enabled %}{{ site.comments.giscus.reactions-enabled }}{% else %}1{% endif %}"
data-emit-metadata="{% if site.comments.giscus.emit-metadata %}{{ site.comments.giscus.emit-metadata }}{% else %}0{% endif %}"
data-input-position="{% if site.comments.giscus.input-position %}{{ site.comments.giscus.input-position }}{% else %}bottom{% endif %}"
data-theme="{% if site.comments.giscus.theme %}{{ site.comments.giscus.theme }}{% elsif site.color_theme == 'dark' %}dark{% else %}light{% endif %}"
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

since you have a script here you could also set color_theme based on the js var from the header too 🤔
That way it would be dynamic and default to the config value.

data-lang="{% if site.comments.giscus.lang %}{{ site.comments.giscus.lang }}{% else %}en{% endif %}"
{% if site.comments.giscus.loading %}data-loading="{{ site.comments.giscus.loading }}"{% endif %}
crossorigin="anonymous"
async>
</script>
Loading