Static comments

[Aaron Meurer]

I'd like to remove Disqus from my blog, and I'm trying to figure out
what the alternatives are. If possible, I'd like to use some kind of
static system, so that I can continue to host my site on GitHub pages
without a server, but also don't rely on some external commenting
service.

Also, if possible, I would like to have something that is automatic.
Something that uses some form of authentication, whether that be email
or some kind of login with a known service would be nice as well.

I saw that Nikola has a "static comments" plugin
(https://plugins.getnikola.com/v7/static_comments/), but based on the
docs, there is quite a bit that would need to be setup to make it work
(I'd have to set up some kind of email field, and then some automation
to post the comment to my site). Has anyone done any additional work
in this direction?

I also saw this site, which is not using Nikola, uses GitHub for
comments http://donw.io/post/github-comments/. I wonder if anyone has
played around with doing this in Nikola.

Does anyone know of any other ways that you can do static comments?

Aaron Meurer

[Roberto Alsina]

On Wed, May 24, 2017 at 7:46 PM Aaron Meurer <asme...@gmail.com> wrote:

I also saw this site, which is not using Nikola, uses GitHub for
comments http://donw.io/post/github-comments/. I wonder if anyone has
played around with doing this in Nikola.

That is *very* interesting!

 

[Roberto Alsina]

Quick experiment, and it actually works!

Just put this in shortcodes/gh_comments.tmpl

<div id=gh-comments-list></div>

<script

  src="https://code.jquery.com/jquery-3.2.1.min.js"

  integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="

  crossorigin="anonymous"></script>

<script>

var url = "https://github.com/dwilliamson/donw.io/issues/" + ${id}

var api_url = "https://api.github.com/repos/dwilliamson/donw.io/issues/" + ${id} + "/comments"

$(document).ready(function () {

    $.ajax(api_url, {

        headers: {Accept: "application/vnd.github.v3.html+json"},

        dataType: "json",

        success: function(comments) {

            $("#gh-comments-list").append("Visit the <b><a href='" + url + "'>Github Issue</a></b> to comment on this post");

            $.each(comments, function(i, comment) {

                var date = new Date(comment.created_at);

                var t = "<div id='gh-comment'>";

                t += "<img src='" + comment.user.avatar_url + "' width='24px'>";

                t += "<b><a href='" + comment.user.html_url + "'>" + comment.user.login + "</a></b>";

                t += " posted at ";

                t += "<em>" + date.toUTCString() + "</em>";

                t += "<div id='gh-comment-hr'></div>";

                t += comment.body_html;

                t += "</div>";

                $("#gh-comments-list").append(t);

            });

        },

        error: function() {

            $("#gh-comments-list").append("Comments are not open for this post yet.");

        }

    });

});

</script>

And then, at the bottom of your post:

{{% gh_comments id=1 %}}

Problem: that shortcode loads jQuery which is probably a bad idea. It should be rewritten not to require it, since it does nothing too special.