update comments

_config.yml

@@ -76,9 +76,12 @@ comments:
     issue-term: pathname
     issue-number:
     theme: preferred-color-scheme
+    label:
     input-position: top # top/bottom 评论框位置
     comment-order: desc # desc 排序
     keep-theme: # true/false
+    loading: false
+    branch: main
   # utterances
   # https://utteranc.es/
   utterances:
@@ -86,6 +89,7 @@ comments:
     issue-term: pathname
     issue-number:
     theme: preferred-color-scheme
+    label:
   valine:
     js: https://cdn.jsdelivr.net/gh/XuxuGood/simple-blog-cdn@main/js/Valine.min.js
     appId: # your appId

layout/_partial/plugins/comments/beaudar/script.ejs

@@ -1,25 +1,26 @@
 <script>
-  function beaudar(){
-    if(!document.getElementById("beaudar"))return;
-    setTimeout(function() {
-      var checkbeaudar = setInterval(function () {
-        var el = document.getElementById("beaudar");
-        if (!el) return
-        clearInterval(checkbeaudar)
+  function loadBeaudar() {
+    const els = document.querySelectorAll("#comments #beaudar");
+    if (els.length === 0) return;
+    els.forEach((el, i) => {
       try {
-          el.innerHTML="";
-        } catch (error) {}
+        el.innerHTML = '';
+      } catch (error) {
+        console.log(error);
+      }
       var script = document.createElement('script');
       script.src = 'https://beaudar.lipk.org/client.js';
-        const keys = ['repo', 'issue-term', 'issue-number', 'theme', 'label', 'crossorigin', 'input-position', 'comment-order', 'keep-theme'];
-        keys.forEach((key, i) => {
-          if (el.attributes[key] && el.attributes[key].value) {
-            script.setAttribute(key, el.attributes[key].value);
+      script.async = true;
+      for (let key of Object.keys(el.attributes)) {
+        let attr = el.attributes[key];
+        if (['class', 'id'].includes(attr.name) === false) {
+          script.setAttribute(attr.name, attr.value);
+        }
       }
-        });
       el.appendChild(script);
-       }, 200)
     });
   }
-  beaudar();
+  window.addEventListener('DOMContentLoaded', (event) => {
+      loadBeaudar();
+  });
 </script>

layout/_partial/plugins/comments/utterances/script.ejs

@@ -1,25 +1,26 @@
 <script>
-  function utterances(){
-    if(!document.getElementById("utterances"))return;
-    setTimeout(function() {
-      var checkUtterances = setInterval(function () {
-        var el = document.getElementById("utterances");
-        if (!el) return
-        clearInterval(checkUtterances)
+  function loadUtterances() {
+    const els = document.querySelectorAll("#comments #utterances");
+    if (els.length === 0) return;
+    els.forEach((el, i) => {
       try {
-          el.innerHTML="";
-        } catch (error) {}
+        el.innerHTML = '';
+      } catch (error) {
+        console.log(error);
+      }
       var script = document.createElement('script');
       script.src = 'https://utteranc.es/client.js';
-        const keys = ['repo', 'issue-term', 'issue-number', 'theme', 'label', 'crossorigin'];
-        keys.forEach((key, i) => {
-          if (el.attributes[key] && el.attributes[key].value) {
-            script.setAttribute(key, el.attributes[key].value);
+      script.async = true;
+      for (let key of Object.keys(el.attributes)) {
+        let attr = el.attributes[key];
+        if (['class', 'id'].includes(attr.name) === false) {
+          script.setAttribute(attr.name, attr.value);
+        }
       }
-        });
       el.appendChild(script);
-       }, 200)
     });
   }
-  utterances();
+  window.addEventListener('DOMContentLoaded', (event) => {
+      loadUtterances();
+  });
 </script>

source/css/_plugins/comments/beaudar.styl

@@ -0,0 +1,3 @@
+.cmt-body.beaudar
+  margin: 0 -4px
+  width: 'calc(100% + %s)' % 8px

source/css/_plugins/index.styl

@@ -7,6 +7,10 @@ if hexo-config('plugins.scrollreveal.enable')
   @import 'scrollreveal'
 
 // 评论
+if hexo-config('comments.service') == 'beaudar'
+  @import 'comments/beaudar'
+if hexo-config('comments.service') == 'twikoo'
+  @import 'comments/twikoo'
 if hexo-config('comments.service') == 'utterances'
   @import 'comments/utterances'
 if hexo-config('comments.service') == 'valine'