Setting Up Giscus: An Ad-Free Alternative to Disqus for Blog Comments

Why I Chose Giscus Over Disqus

I recently decided to add a commenting system to my blog. I remembered hearing about various dramas and issues with Disqus over the yearsโ€”particularly that they display advertisements on blogs using their free tier, and there have been privacy concerns. A detailed article by noraj on blog.raw.pm documents many of these issues, including forced ad injection, intrusive banner ads (700px ร— 700px, violating industry standards), privacy violations (tracking without consent, facing a $3M fine in Norway), data breaches, and opaque revenue-sharing programs. So when I wanted to enable comments on my blog, I knew I didn’t want to use Disqus.

I wanted something that was:

  • Ad-free by default
  • Open source
  • Free (no hidden costs)

After doing some research, I discovered Giscus , an open-source commenting system powered by GitHub Discussions.

About Giscus

Giscus is a comments system that uses GitHub Discussions to store and manage comments. It’s completely free, open-source, and doesn’t display any advertisements. All comments are stored in a GitHub repository’s Discussions section, giving you full control over your data. Since it’s powered by GitHub, it’s at least more transparent than proprietary solutions.

The Microsoft/GitHub Question

I know what you might be thinking: “But Microsoft owns GitHub. Are you comfortable with that?”

Honestly? I don’t really care. I’ve been a GitHub user for years, and it’s become an integral part of my workflow. Whether it’s Microsoft, Google, or any other tech giant, I’m already using their services daily. The important thing is that Giscus is open-source, transparent, and gives me control over my dataโ€”unlike proprietary solutions that might change their terms or add ads later.

Prerequisites

Before setting up Giscus, you’ll need:

  1. A GitHub account (free)
  2. A public GitHub repository (or one where you can enable Discussions)
  3. A static website (Hugo, Jekyll, Next.js, etc.)

Step-by-Step Setup

Step 1: Create a Repository for Comments

First, create a new GitHub repository to host your blog comments. You can do this via the GitHub web interface or using the GitHub CLI:

gh repo create blog-comments --public --description "GitHub Discussions for blog comments"

Step 2: Enable GitHub Discussions

GitHub Discussions aren’t enabled by default. To enable them:

  1. Go to your repository on GitHub
  2. Click on Settings
  3. Scroll down to Features
  4. Check the box next to Discussions
  5. Click Save

Alternatively, you can enable Discussions via the GitHub API:

gh api repos/OWNER/REPO -X PATCH -f has_discussions=true

Step 3: Install the Giscus App

Giscus needs permission to access your repository to create discussions. Install the Giscus GitHub App:

  1. Visit https://github.com/apps/giscus
  2. Click Install or Configure
  3. Select your comments repository (or all repositories)
  4. Click Install

Step 4: Get Your Configuration

Now you need to get your repository and category IDs:

Repository ID:

gh api repos/OWNER/REPO | jq -r '.node_id'

Category IDs:

gh api graphql -f query='query { repository(owner: "OWNER", name: "REPO") { discussionCategories(first: 10) { nodes { id name } } } }' | jq -r '.data.repository.discussionCategories.nodes[] | "\(.id) \(.name)"'

Or, you can use the Giscus configuration page :

  1. Visit https://giscus.app/
  2. Enter your repository name (e.g., username/blog-comments)
  3. Select your discussion category (usually “General”)
  4. Choose your preferences:
    • Theme: preferred_color_scheme (adapts to user’s system theme)
    • Language: Your preferred language
    • Mapping: pathname (creates one discussion per blog post URL)
    • Reactions: Enable or disable emoji reactions
    • Input position: bottom (comment box at the bottom)
  5. Copy the generated script

Step 5: Add Giscus to Your Blog

The integration method depends on your static site generator. Here’s how to do it for Hugo:

For Hugo

  1. Create a comments partial (layouts/partials/comments.html):
{{- if not .Params.hideComments -}}
  {{- $giscus := .Site.Language.Params.giscus -}}
  {{- if and $giscus $giscus.repo $giscus.repoId -}}
  <hr style="margin-top: 40px; margin-bottom: 40px;" />
  <div style="max-width: 100%;">
    <script src="https://giscus.app/client.js"
      data-repo="{{ $giscus.repo }}"
      data-repo-id="{{ $giscus.repoId }}"
      data-category="{{ $giscus.category }}"
      data-category-id="{{ $giscus.categoryId }}"
      data-mapping="{{ default "pathname" $giscus.mapping }}"
      data-strict="0"
      data-reactions-enabled="{{ default "1" $giscus.reactionsEnabled }}"
      data-emit-metadata="0"
      data-input-position="{{ default "bottom" $giscus.inputPosition }}"
      data-theme="{{ default "preferred_color_scheme" $giscus.theme }}"
      data-lang="{{ default "en" $giscus.lang }}"
      data-loading="lazy"
      crossorigin="anonymous"
      async>
    </script>
  </div>
  {{- end -}}
{{- end -}}
  1. Include it in your post template (usually layouts/_default/single.html):
{{- partial "comments.html" . -}}
  1. Add configuration to config.toml:
[Languages.en-us.params.giscus]
  repo = "username/blog-comments"
  repoId = "YOUR_REPO_ID"
  category = "General"
  categoryId = "YOUR_CATEGORY_ID"
  mapping = "pathname"
  reactionsEnabled = "1"
  inputPosition = "bottom"
  theme = "preferred_color_scheme"
  lang = "en"

For Other Static Site Generators

For Jekyll, Next.js, or other frameworks, simply add the script tag from giscus.app to your post template. The script will automatically handle comment creation and management.

Step 6: Test It Out

After adding the code:

  1. Build and deploy your site
  2. Visit a blog post
  3. Scroll to the bottom where the comments section should appear
  4. Try leaving a comment (you’ll need to sign in with GitHub)
  5. Check your repository’s Discussions section to see the comment

Benefits of Giscus

  • ๐Ÿšซ No ads: Unlike Disqus, Giscus is completely ad-free
  • ๐Ÿ†“ Free: Completely free and open source
  • ๐ŸŽจ Customizable: Themes, languages, and more
  • ๐Ÿ”„ GitHub integration: Comments are stored in GitHub Discussions
  • ๐Ÿ“ฑ Responsive: Works great on mobile devices
  • ๐Ÿ” Transparent: All comments are visible in your GitHub repository

How It Works

  • Each blog post automatically creates or links to a GitHub Discussion
  • Visitors can comment using their GitHub account
  • All comments are stored in your repository’s Discussions section
  • You can moderate, edit, or delete comments directly on GitHub
  • Comments support Markdown formatting

Tips and Best Practices

  1. Moderation: Set up discussion moderators in your repository settings
  2. Categories: Organize comments by category (General, Announcements, etc.)
  3. Notifications: Enable GitHub notifications to stay updated on new comments
  4. Backup: Since comments are in GitHub, you can easily export them
  5. Transparency: Consider adding a note explaining that comments are stored on GitHub

Conclusion

Switching to Giscus was one of the best decisions I made for my blog. It’s free, ad-free, and integrates seamlessly with my existing GitHub workflow. While it requires visitors to have a GitHub account to comment, this is often acceptable for technical blogs where most readers are developers anyway.

If you’re looking for an alternative to Disqus that doesn’t display ads, I highly recommend giving Giscus a try.

Resources


Have you tried Giscus or another commenting system? Let me know your experience in the comments below!