[feat] add waline v3

_config.yml

@@ -242,6 +242,10 @@ comments:
     #   token: # 图床验证
     #   resp: # 图片地址返回值的字段
 
+  waline_v3:
+    # Waline server address url, you should set this to your own link
+    serverURL: https://waline.vercel.app
+
   # Artalk
   # https://artalk.js.org/
   artalk:

layout/_partial/comments/waline_v3/layout.ejs

@@ -0,0 +1,23 @@
+<%
+function layoutDiv() {
+  var el = ''
+  el += '<div id="waline_container" class="waline_thread"'
+  const cfg = theme.comments['waline_v3']
+  var attrs = {}
+  if (page.comment_id) {
+    attrs['comment_id'] = page.comment_id
+  }
+  // 参数在这里进行传递
+  attrs.serverURL = cfg?.serverURL
+  
+  for (let key of Object.keys(attrs)) {
+    if (attrs[key]) {
+      el += ' ' + key + '="' + attrs[key] + '"'
+    }
+  }
+  el += `>${icon('default:loading')}</div>`
+  return el
+}
+%>
+
+<%- layoutDiv() %>

layout/_partial/comments/waline_v3/script.ejs

@@ -0,0 +1,17 @@
+<script defer type="module">
+  import { init } from 'https://unpkg.com/@waline/client@v3/dist/waline.js';
+  window.addEventListener('DOMContentLoaded', (event) => {
+    utils.css('https://unpkg.com/@waline/client@v3/dist/waline.css');
+    const id = 'waline_container';
+    const el = document.getElementById(id);
+    var path = el.getAttribute('comment_id');
+    if (!path) {
+      path = decodeURI(window.location.pathname);
+    }
+    const waline = init({
+      el: `#${id}`,
+      path: path,
+      serverURL: el.getAttribute('serverURL'),
+    });
+  });
+</script>

source/css/_plugins/comments/waline.styl

@@ -1,4 +1,4 @@
-.cmt-body.waline
+.cmt-body
   .wl-panel
     margin: 0.5em 0 !important
   .wl-meta-head

source/css/_plugins/index.styl

@@ -28,5 +28,7 @@ if hexo-config('comments.service') == 'utterances'
   @import 'comments/utterances'
 if hexo-config('comments.service') == 'waline'
   @import 'comments/waline'
+if hexo-config('comments.service') == 'waline_v3'
+  @import 'comments/waline'
 if hexo-config('comments.service') == 'artalk'
   @import 'comments/artalk'