A lightweight comments widget built on GitHub issues. Looks great, and it's really easy to install and manage.
I was looking for a simple, safe and lightweight comment system to add to this blog, till I came across utterances through Tania Rascia's blog.
Utterances is an open source project by Jeremy Danyow built on Github Issues. This makes the comment section of your blog look really dev-familiar with all the benefits of using Github to submit and manage comments.
In practice, this means that your visitors will have to login to github to submit a comment (hopefully avoiding bots and spammy content) and once submitted, all comments will be hosted on the issues area of a repo of your choice. It has to be a public repo though, otherwise comments will not be visible to the users.
The utterance's documentation is pretty straightforward. First, you'll have to install utterances on your repo. Just like Tania, I created a blog-comments repo just to host the comments and avoid polluting my blog's repo with issues.
Once you've done that, you'll have to add a script tag exactly in the position where you want your comment section to appear. The utterances website provides a simple UI where you can choose the config options for this script.
Here's what my final script looks like:
<script src="https://utteranc.es/client.js"
repo="anansilva/blog-comments"
issue-term="title"
label="comments"
theme="preferred-color-scheme"
crossorigin="anonymous"
async>
</script>
The issue-term tag defines the title of the issue that will be open on github once your visitors start commenting a post. In my case, it will be equal to the title of the post - fetched from the meta_title of the page. One other thing I love about utterances is that it has a preferred-color-scheme for the comments box, which means that it will adapt the styles to the visitor's operating system (light or dark mode). My blog is built on the same premise, so it comes in handy.
Check how it looks on my blog, and feel free to comment there!
Top comments (0)