feat: gitalk comment

layouts/_default/single.html

@@ -82,7 +82,13 @@ <h2>{{ i18n "comments" }}</h2>
         </div>
 
       {{- end -}}
+      {{- if .Site.Params.gitalk.repo -}}
+        <div id="fb_comments_container">
+          <h2>{{ i18n "comments" }}</h2>
+          {{ partial "comments/gitalk.html" . }}
+        </div>
 
+      {{- end -}}
 
     {{ end }}
   </div>

layouts/partials/comments/gitalk.html

@@ -0,0 +1,21 @@
+<div id="gitalk-container"></div>
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css">
+<script src="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js"></script>
+<script>
+  const gitalk = new Gitalk({
+    clientID: '{{ .Site.Params.Gitalk.clientID }}',
+    clientSecret: '{{ .Site.Params.Gitalk.clientSecret }}',
+    repo: '{{ .Site.Params.Gitalk.repo }}',
+    owner: '{{ .Site.Params.Gitalk.owner }}',
+    admin: ['{{ .Site.Params.Gitalk.owner }}'],
+    id: location.pathname, // Ensure uniqueness and length less than 50
+    distractionFreeMode: false // Facebook-like distraction free mode
+  });
+  (function() {
+    if (["localhost", "127.0.0.1"].indexOf(window.location.hostname) != -1) {
+      document.getElementById('gitalk-container').innerHTML = 'Gitalk comments not available by default when the website is previewed locally.';
+      return;
+    }
+    gitalk.render('gitalk-container');
+  })();
+</script>