Home

How to Add Comments to a Blog Built with a Static Site Generator

Whether you’ve built your blog with Gatsby, Jekyll, Hugo, or even plain HTML, the hardest thing to add to a static site is dynamic functionality (like comments). There are a few different solutions to this problem, all with their own use cases, so you’re going to have to decide which one is right for your site.

What are my options?

Integrate with a third party

Integrating with a third party comes with a lot of benefits. They are generally easy to set up and maintain, but sometimes this comes at the cost of performance and privacy. You are also surrendering your comment data to a third party - if the service disappears your comments may as well.

Disqus

Probably the most popular comment hosting system on the web, it does its one job well and comes with a handy free plan without ads for non-commercial personal blogs.

Unfortunately, it also comes with some serious baggage. Remember: when a product is free, you are the product. In the case of Disqus, they’re not exactly well known for respecting the privacy of your readers, tracking them everywhere they go. All those tracking scripts won’t do any favours for your blog’s performance either!

Facebook Comments

Another very popular free provider with similar data privacy concerns to Disqus. You also have to consider the audience of your blog when integrating with Facebook, will your users want to post to your blog using their very public Facebook profile?

Commento

Commento is a product similar to Disqus, except with a focus on user privacy. This means that they won’t inject tracking scripts onto your site and they won’t show ads. The downside? There’s no free version. However, the pricing plan is very generous and you can choose what you pay for the product starting at at minimum of $3/month.

Self-host an open source system

Self-hosting an open-source commenting system means that you maintain complete control of your comments and your users’ data, but at the cost of having to set-up, manage, and pay for your own server.

Discourse

The hosted version of Discourse is too expensive for use on most small blogs, the standard pricing plan is $100/month. Fortunately for us Discourse is 100% open source. So if you have the technical know-how you can install it on your own server free of charge (of course you’ll still have to pay server costs, but it will run fine on a $5 Digital Ocean droplet for many use-cases).

One downside of using Discourse as a comment system is that your users will have to be redirected away from your blog and to your Discourse forum in order to post, but you can still pull in and display comments beneath your articles. You can read more about using Discourse for comments here.

Host comments on another platform

Hosting comments on another platform is easy to set-up and means that you don’t have to worry about the potential performance hit of installing third-party scripts on your site. However, it is a more tedious process for your users to leave comments which may lead to a reduction in engagement.

Use Twitter

If your target demographic is on Twitter then there is an easy way to get a discussion started around your content. Simply create a dedicated tweet for each post and link your readers to it at the bottom of each article.

Use Reddit

Reddit is a popular social platform, and one great thing about it is that you can easily create a subreddit to kick-start your own community. By posting all of your blog posts to Reddit and leaving a link to the posts at the end of each article you’ve quickly created a convenient way for your readers to get involved.

Use GitHub for comments

One big plus of a static site is that all the data for your content lives inside the repository alongside your code, it therefore makes sense that your comments could be stored there too.

Staticman

Staticman is a simple yet powerful service that will create pull requests to your GitHub repository as the result of a user submitted form. This is great! It means that with a simple HTML form you can have your user’s comments stored in your repository as markdown, along with the rest of your content.

The downside of this method is that your site will have to rebuild each time a comment is posted, and your user will have to wait for it to build for their comments to show. (Although this pain point can be relieved with some smart optimistic rendering).

Also, it’s a lot more work to set up than many of the other solutions in this article.

Use Github Issues

If the target audience of your blog is software developers then using GitHub Issues as your commenting system makes a lot of sense. GitHub issues come with a lot of great moderation tools out of the box! Creating a comment system is as simple as creating an issue for each blog post and displaying those comments at the bottom of your article.

You can even automate this process using a tool like Gitment or Utterances (the solution I use for this blog) which provides a handy comment widget for you to install on your site.

One potential “Issue” (see what I did there?) with using one of these solutions is that while your comments are still stored in GitHub they are not actually part of your repository. Which means that you lose all the benefits of version control and your data is still technically held by a third party - in this case GitHub.

Roll your own system

Sometimes none of the off-the-shelf solutions quite fit your use-case and you’ll need to roll your own comment system. You’ll need to be aware that a lot more goes into building a comment system than initially meets the eye - how will you handle moderation, spam, and notifications for replies?

If you are set on building your own system you probably don’t want to have to write and host server-side code just for handling comments, which means you’re going to want to look at a “serverless” provider.

Firebase

You could have a form submission on your website that calls a Firebase function which stores the comment in a Firestore database. You could then fetch these comments to display on your page when it loads.

Netlify

If you are using Netlify for hosting you could use their Forms service to call a Function to save the comment into an external database, or push to your repository, or do anything else with the data!

Which solution is right for you?

Ultimately that is something you have to decide for yourself by weighing up the pros and cons. How important is data privacy and performance to your users? If the answer is not much then something like Disqus may be the right fit for you. It is easy to set up and prevalent across the web, which means your users will be familiar with it and may even already have an account.

If your users are more privacy-minded then Disqus may not be the right fit. Software developers, for example, are extremely privacy conscious. As my blog is aimed at other software developers I use Utterances as a comment system. However, remember that your readers will need a GitHub account to leave a comment using Utterances so if your target audience do not work (or play!) within the tech industry this will not be the comment system for you.

Whichever solution you choose remember that the most important thing is that it not only works for you but also provides a smooth and seamless experience for your users!

What are you using for comments on your blog? Did I miss any great solutions that you love? Let me know in the comments below 👇


Ben Honeywill

Written by Ben Honeywill 👨‍💻 who lives in Bournemouth 🏖️ building cool web software for Lush 🧼

You should follow me on Twitter 🐦 and GitHub 💻

Join my newsletter!

By subscribing to my mailing list you can keep up to date with my latest articles by email. I will never send you spam.