hugo-fixit · Lruihao · Jan 30, 2022 · Jan 30, 2022
diff --git a/exampleSite/config.toml b/exampleSite/config.toml
@@ -707,7 +707,13 @@ enableEmoji = true
     # Comment config
     # 评论系统设置
     [params.page.comment]
-      enable = false
+      enable = true
+      # Artalk comment system config
+      # Artalk 评论系统设置
+      [params.page.comment.artalk]
+        enable = true
+        server = "https://yourdomain/api/"
+        sitename = "默认站点"
       # Disqus comment config (https://disqus.com/)
       # Disqus 评论系统设置 (https://disqus.com/)
       [params.page.comment.disqus]

diff --git a/layouts/partials/comment.html b/layouts/partials/comment.html
@@ -4,127 +4,159 @@
 {{- $commentConfig := dict -}}
 
 {{- if $comment.enable -}}
-  <div id="comments">
-    {{- /* Disqus Comment System */ -}}
-    {{- $disqus := $comment.disqus | default dict -}}
-    {{- if $disqus.enable -}}
-      <div id="disqus_thread" class="comment"></div>
-      {{- $source := printf "https://%v.disqus.com/embed.js" $disqus.shortname -}}
-      {{- dict "Source" $source "Defer" true | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
-      <noscript>
-        Please enable JavaScript to view the comments powered by <a href="https://disqus.com/?ref_noscript">Disqus</a>.
-      </noscript>
-    {{- end -}}
+<div id="comments">
+  {{- /* Artalk Comment System */ -}}
+  {{- $artalk := $comment.artalk | default dict -}}
+  {{- if $artalk.enable -}}
+  <div id="artalk_thread" class="comment"></div>
+  <!-- CSS -->
+  <link href="https://cdn.jsdelivr.net/npm/artalk@2.1.4/dist/Artalk.css" rel="stylesheet">
+  <!-- JS -->
+  <script src="https://cdn.jsdelivr.net/npm/artalk@2.1.4/dist/Artalk.js"></script>
+  <!-- Artalk -->
+  <div id="Comments"></div>
+  <script>
+    new Artalk({
+      el: '#Comments',
+      pageTitle: "{{ .Title }}",
+      server: "{{ $artalk.server }}",
+      site: "{{ $artalk.sitename }}",
+    })
+  </script>
+  {{- end -}}
 
-    {{- /* Gitalk Comment System */ -}}
-    {{- $gitalk := $comment.gitalk | default dict -}}
-    {{- if $gitalk.enable -}}
-      <div id="gitalk" class="comment"></div>
-      {{- $source := $cdn.gitalkCSS | default "lib/gitalk/gitalk.css" -}}
-      {{- dict "Source" $source "Minify" true "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial "scratch/style.html" -}}
-      {{- $source := $cdn.gitalkJS | default "lib/gitalk/gitalk.min.js" -}}
-      {{- dict "Source" $source "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
-      {{- $commentConfig = dict "id" .Date "title" .Title "clientID" $gitalk.clientId "clientSecret" $gitalk.clientSecret "repo" $gitalk.repo "owner" $gitalk.owner "admin" (slice $gitalk.owner) | dict "gitalk" | merge $commentConfig -}}
-      <noscript>
-        Please enable JavaScript to view the comments powered by <a href="https://github.com/gitalk/gitalk"></a>Gitalk</a>.
-      </noscript>
-    {{- end -}}
+  {{- /* Disqus Comment System */ -}}
+  {{- $disqus := $comment.disqus | default dict -}}
+  {{- if $disqus.enable -}}
+  <div id="disqus_thread" class="comment"></div>
+  {{- $source := printf "https://%v.disqus.com/embed.js" $disqus.shortname -}}
+  {{- dict "Source" $source "Defer" true | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
+  <noscript>
+    Please enable JavaScript to view the comments powered by <a href="https://disqus.com/?ref_noscript">Disqus</a>.
+  </noscript>
+  {{- end -}}
 
-    {{- /* Valine Comment System */ -}}
-    {{- $valine := $comment.valine | default dict -}}
-    {{- if $valine.enable -}}
-      <div id="valine" class="comment"></div>
-      {{- $options := dict "targetPath" "lib/valine/valine.min.css" -}}
-      {{- dict "Source" "lib/valine/valine.scss" "ToCSS" $options | dict "Scratch" .Scratch "Data" | partial "scratch/style.html" -}}
-      {{- $source := $cdn.valineJS | default "lib/valine/Valine.min.js" -}}
-      {{- dict "Source" $source "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
-      {{- $commentConfig = dict "el" "#valine" "appId" $valine.appId "appKey" $valine.appKey "lang" ($valine.lang | default (T "valineLang")) "visitor" $valine.visitor "recordIP" $valine.recordIP "placeholder" ($valine.placeholder | default (T "valinePlaceholder")) "highlight" (ne $valine.highlight false) "enableQQ" $valine.enableQQ | dict "valine" | merge $commentConfig -}}
-      {{- with $valine.avatar -}}
-        {{- $commentConfig = dict "avatar" . | dict "valine" | merge $commentConfig -}}
-      {{- end -}}
-      {{- with $valine.meta -}}
-        {{- $commentConfig = dict "meta" . | dict "valine" | merge $commentConfig -}}
-      {{- end -}}
-      {{- with $valine.pageSize -}}
-        {{- $commentConfig = dict "pageSize" . | dict "valine" | merge $commentConfig -}}
-      {{- end -}}
-      {{- with $valine.serverURLs -}}
-        {{- $commentConfig = dict "serverURLs" . | dict "valine" | merge $commentConfig -}}
-      {{- end -}}
-      {{- $commentConfig = $valine.emoji | default "google.yml" | printf "data/emoji/%v" | resources.Get | transform.Unmarshal | dict "valine" | merge $commentConfig -}}
-      <noscript>
-        Please enable JavaScript to view the comments powered by <a href="https://valine.js.org/">Valine</a>.
-      </noscript>
-    {{- end -}}
+  {{- /* Gitalk Comment System */ -}}
+  {{- $gitalk := $comment.gitalk | default dict -}}
+  {{- if $gitalk.enable -}}
+  <div id="gitalk" class="comment"></div>
+  {{- $source := $cdn.gitalkCSS | default "lib/gitalk/gitalk.css" -}}
+  {{- dict "Source" $source "Minify" true "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial
+  "scratch/style.html" -}}
+  {{- $source := $cdn.gitalkJS | default "lib/gitalk/gitalk.min.js" -}}
+  {{- dict "Source" $source "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial "scratch/script.html"
+  -}}
+  {{- $commentConfig = dict "id" .Date "title" .Title "clientID" $gitalk.clientId "clientSecret" $gitalk.clientSecret
+  "repo" $gitalk.repo "owner" $gitalk.owner "admin" (slice $gitalk.owner) | dict "gitalk" | merge $commentConfig -}}
+  <noscript>
+    Please enable JavaScript to view the comments powered by <a href="https://github.com/gitalk/gitalk"></a>Gitalk</a>.
+  </noscript>
+  {{- end -}}
 
-    {{- /* Facebook Comment System */ -}}
-    {{- $facebook := $comment.facebook | default dict -}}
-    {{- if $facebook.enable -}}
-      <div id="fb-root" class="comment"></div>
-      <div
-        class="fb-comments"
-        data-href="{{ .Permalink }}"
-        data-width="{{ $facebook.width }}"
-        data-numposts="{{ $facebook.numPosts }}"
-      ></div>
-      {{- $source := printf "https://connect.facebook.net/%v/sdk.js#xfbml=1&version=v5.0&appId=%v&autoLogAppEvents=1" ($facebook.languageCode | default (T "facebookLanguageCode")) $facebook.appId -}}
-      {{- dict "Source" $source "Defer" true | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
-      <noscript>
-        Please enable JavaScript to view the comments powered by <a href="https://developers.facebook.com/docs/plugins/comments/"></a>Facebook</a>.
-      </noscript>
-    {{- end -}}
+  {{- /* Valine Comment System */ -}}
+  {{- $valine := $comment.valine | default dict -}}
+  {{- if $valine.enable -}}
+  <div id="valine" class="comment"></div>
+  {{- $options := dict "targetPath" "lib/valine/valine.min.css" -}}
+  {{- dict "Source" "lib/valine/valine.scss" "ToCSS" $options | dict "Scratch" .Scratch "Data" | partial
+  "scratch/style.html" -}}
+  {{- $source := $cdn.valineJS | default "lib/valine/Valine.min.js" -}}
+  {{- dict "Source" $source "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial "scratch/script.html"
+  -}}
+  {{- $commentConfig = dict "el" "#valine" "appId" $valine.appId "appKey" $valine.appKey "lang" ($valine.lang | default
+  (T "valineLang")) "visitor" $valine.visitor "recordIP" $valine.recordIP "placeholder" ($valine.placeholder | default
+  (T "valinePlaceholder")) "highlight" (ne $valine.highlight false) "enableQQ" $valine.enableQQ | dict "valine" | merge
+  $commentConfig -}}
+  {{- with $valine.avatar -}}
+  {{- $commentConfig = dict "avatar" . | dict "valine" | merge $commentConfig -}}
+  {{- end -}}
+  {{- with $valine.meta -}}
+  {{- $commentConfig = dict "meta" . | dict "valine" | merge $commentConfig -}}
+  {{- end -}}
+  {{- with $valine.pageSize -}}
+  {{- $commentConfig = dict "pageSize" . | dict "valine" | merge $commentConfig -}}
+  {{- end -}}
+  {{- with $valine.serverURLs -}}
+  {{- $commentConfig = dict "serverURLs" . | dict "valine" | merge $commentConfig -}}
+  {{- end -}}
+  {{- $commentConfig = $valine.emoji | default "google.yml" | printf "data/emoji/%v" | resources.Get |
+  transform.Unmarshal | dict "valine" | merge $commentConfig -}}
+  <noscript>
+    Please enable JavaScript to view the comments powered by <a href="https://valine.js.org/">Valine</a>.
+  </noscript>
+  {{- end -}}
 
-    {{- /* Telegram Comments System */ -}}
-    {{- $telegram := $comment.telegram | default dict -}}
-    {{- if $telegram.enable -}}
-      <div id="telegram-comments" class="comment"></div>
-      {{- $attr := printf `data-comments-app-website="%v"` $telegram.siteID -}}
-      {{- $attr = printf `%v data-limit="%v"` $attr ($telegram.limit | default 5) -}}
-      {{- with $telegram.height -}}
-        {{- $attr = printf `%v data-height="%v"` $attr . -}}
-      {{- end -}}
-      {{- with $telegram.color -}}
-        {{- $attr = printf `%v data-color="%v"` $attr . -}}
-      {{- end -}}
-      {{- if $telegram.colorful -}}
-        {{- $attr = printf `%v data-colorful="1"` $attr -}}
-      {{- end -}}
-      {{- if $telegram.dislikes -}}
-        {{- $attr = printf `%v data-dislikes="1"` $attr -}}
-      {{- end -}}
-      {{- if $telegram.outlined -}}
-        {{- $attr = printf `%v data-outlined="1"` $attr -}}
-      {{- end -}}
-      {{- dict "Source" "https://comments.app/js/widget.js?2" "Defer" true "Attr" $attr | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
-      <noscript>
-        Please enable JavaScript to view the comments powered by <a href="https://comments.app/">Telegram Comments</a>.
-      </noscript>
-    {{- end -}}
+  {{- /* Facebook Comment System */ -}}
+  {{- $facebook := $comment.facebook | default dict -}}
+  {{- if $facebook.enable -}}
+  <div id="fb-root" class="comment"></div>
+  <div class="fb-comments" data-href="{{ .Permalink }}" data-width="{{ $facebook.width }}"
+    data-numposts="{{ $facebook.numPosts }}"></div>
+  {{- $source := printf "https://connect.facebook.net/%v/sdk.js#xfbml=1&version=v5.0&appId=%v&autoLogAppEvents=1"
+  ($facebook.languageCode | default (T "facebookLanguageCode")) $facebook.appId -}}
+  {{- dict "Source" $source "Defer" true | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
+  <noscript>
+    Please enable JavaScript to view the comments powered by <a
+      href="https://developers.facebook.com/docs/plugins/comments/"></a>Facebook</a>.
+  </noscript>
+  {{- end -}}
 
-    {{- /* Commento Comment System */ -}}
-    {{- $commento := $comment.commento | default dict -}}
-    {{- if $commento.enable -}}
-      <div id="commento"></div>
-      {{- dict "Source" "https://cdn.commento.io/js/commento.js" "Defer" true | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
-      <noscript>
-        Please enable JavaScript to view the comments powered by <a href="https://commento.io/">Commento</a>.
-      </noscript>
-    {{- end -}}
+  {{- /* Telegram Comments System */ -}}
+  {{- $telegram := $comment.telegram | default dict -}}
+  {{- if $telegram.enable -}}
+  <div id="telegram-comments" class="comment"></div>
+  {{- $attr := printf `data-comments-app-website="%v"` $telegram.siteID -}}
+  {{- $attr = printf `%v data-limit="%v"` $attr ($telegram.limit | default 5) -}}
+  {{- with $telegram.height -}}
+  {{- $attr = printf `%v data-height="%v"` $attr . -}}
+  {{- end -}}
+  {{- with $telegram.color -}}
+  {{- $attr = printf `%v data-color="%v"` $attr . -}}
+  {{- end -}}
+  {{- if $telegram.colorful -}}
+  {{- $attr = printf `%v data-colorful="1"` $attr -}}
+  {{- end -}}
+  {{- if $telegram.dislikes -}}
+  {{- $attr = printf `%v data-dislikes="1"` $attr -}}
+  {{- end -}}
+  {{- if $telegram.outlined -}}
+  {{- $attr = printf `%v data-outlined="1"` $attr -}}
+  {{- end -}}
+  {{- dict "Source" "https://comments.app/js/widget.js?2" "Defer" true "Attr" $attr | dict "Scratch" .Scratch "Data" |
+  partial "scratch/script.html" -}}
+  <noscript>
+    Please enable JavaScript to view the comments powered by <a href="https://comments.app/">Telegram Comments</a>.
+  </noscript>
+  {{- end -}}
 
-    {{- /* Utterances Comment System */ -}}
-    {{- $utterances := $comment.utterances | default dict -}}
-    {{- if $utterances.enable -}}
-      <div id="utterances"></div>
-      {{- $commentConfig = dict "repo" $utterances.repo | dict "utterances" | merge $commentConfig -}}
-      {{- $commentConfig = $utterances.issueTerm | default "pathname" | dict "issueTerm" | dict "utterances" | merge $commentConfig -}}
-      {{- $commentConfig = dict "label" $utterances.label | dict "utterances" | merge $commentConfig -}}
-      {{- $commentConfig = $utterances.lightTheme | default "github-light" | dict "lightTheme" | dict "utterances" | merge $commentConfig -}}
-      {{- $commentConfig = $utterances.darkTheme | default "github-dark" | dict "darkTheme" | dict "utterances" | merge $commentConfig -}}
-      <noscript>
-        Please enable JavaScript to view the comments powered by <a href="https://utteranc.es/">Utterances</a>.
-      </noscript>
-    {{- end -}}
-  </div>
+  {{- /* Commento Comment System */ -}}
+  {{- $commento := $comment.commento | default dict -}}
+  {{- if $commento.enable -}}
+  <div id="commento"></div>
+  {{- dict "Source" "https://cdn.commento.io/js/commento.js" "Defer" true | dict "Scratch" .Scratch "Data" | partial
+  "scratch/script.html" -}}
+  <noscript>
+    Please enable JavaScript to view the comments powered by <a href="https://commento.io/">Commento</a>.
+  </noscript>
+  {{- end -}}
+
+  {{- /* Utterances Comment System */ -}}
+  {{- $utterances := $comment.utterances | default dict -}}
+  {{- if $utterances.enable -}}
+  <div id="utterances"></div>
+  {{- $commentConfig = dict "repo" $utterances.repo | dict "utterances" | merge $commentConfig -}}
+  {{- $commentConfig = $utterances.issueTerm | default "pathname" | dict "issueTerm" | dict "utterances" | merge
+  $commentConfig -}}
+  {{- $commentConfig = dict "label" $utterances.label | dict "utterances" | merge $commentConfig -}}
+  {{- $commentConfig = $utterances.lightTheme | default "github-light" | dict "lightTheme" | dict "utterances" | merge
+  $commentConfig -}}
+  {{- $commentConfig = $utterances.darkTheme | default "github-dark" | dict "darkTheme" | dict "utterances" | merge
+  $commentConfig -}}
+  <noscript>
+    Please enable JavaScript to view the comments powered by <a href="https://utteranc.es/">Utterances</a>.
+  </noscript>
+  {{- end -}}
+</div>
 {{- end -}}
 
-{{- dict "comment" $commentConfig | dict "config" | merge (.Scratch.Get "this") | .Scratch.Set "this" -}}
+{{- dict "comment" $commentConfig | dict "config" | merge (.Scratch.Get "this") | .Scratch.Set "this" -}}