Adding comments in blog posts on github-pages

14
votes

I've made a website based on Github pages using Jekyll Theme. Currently I can post blogs in that website as well. However, I want to add a comments section at the end of the blog posts.

There are tutorials on how to add comments sections using Disqus. But I think that to use Disqus one needs to have a paid subscription. So I am looking for an alternative to Disqus to add a comments section.

Sharing any idea about it will be appreciated.

4
githubjekylldisqusweb-site-projectjekyll-theme

4 Answers

15
votes

You can use GitHub Issues themselves, in a public repo, as a commenting system, via a 3rd-party GitHub plugin called "utterances". See here:

  1. Utterances main page & installation info.: https://utteranc.es/
  2. Utterances GitHub repo: https://github.com/utterance/utterances
  3. You must install the utterances plugin into your GitHub account, here: https://github.com/apps/utterances
    1. GitHub lets you install this app for all of your respositories, or just repositories you select, which is nice. You may just want to install it on GitHub Pages repos you have, since it only needs access to those repos.
    2. Make sure your repos using utterances are public, or else readers won't be able to view the issues/comments, or comment.

Other options also exist. Michael Rose, the creator of the #1 most popular GitHub-Pages-compatible minimal-mistakes Jekyll theme (see a demo here), has put together a short list of commenting systems here.

  1. Disqus
  2. Discourse
  3. Facebook
  4. utterances - my favorite, since it is Free and Open Source (MIT license) and no-cost, and uses convenient GitHub Issues as the commenting system. GitHub Issues comments have excellent markdown support, allow inserting nicely-formatted code blocks right into them, can be edited indefinitely, moderated by you (including editing or deleting comments which are inappropriate), and responded to with upvote buttons--all reasons I like them.
  5. Staticman

Update Jan. 2021: I have now implemented Utterances on my personal website here: https://gabrielstaples.com/. Example page: https://gabrielstaples.com/google-pixel2-touchscreen/ -- scroll to the bottom to see the Utterances (GitHub Issues-based) comment section.

Old answer

(this is how to manually use GitHub Issues as a commenting system, withOUT using utterances):

Give this a shot. This blog describes using a GitHub Issue to store comments for your static website: https://jekyllcodex.org/blog/gdpr-compliant-comment/

Here are some comment examples you can see at the bottom of the blog post. They support markdown syntax and look very nice: enter image description here

And they come directly from a GitHub issue, as can be seen on GitHub here:

enter image description here

8
votes

Note that you typically cannot use comments in a static site. You need a third-party solution, or you need to use the Github hack to create GDPR compliant comments.

Staticman is an option.

You can find more solutions by searching for 'comments' at https://www.thenewdynamic.org.

1
votes

You can use Comments.js to setup pure-Javascript comments for free with Github pages. It's open source and there is a tutorial here on how to set it up with Github pages (Jekyll) specifically: https://zetabase.io/blog-post/setting-up-comments-on-jekyll-github-pages

The benefit of Comments.js over Disqus is that it's free, and the benefit over things like using Github Issues is it's not klugey. As for staticman, that's a very cool solution but likely isn't something you'll want to use at scale. Also, all the above are rather tough to extend, whereas Comments.js is pure javascript, so you can customize it as you require.

Also, by default it uses google sign-in with no special configurations needed on your end. This makes it easy for your users to comment while still having an account structure to identify people.

Happy hacking!

0
votes

Facebook provides similar plugin for free. I'll highly recommend Facebook Comments Plugin