📦 update: minivaline

_config.yml

@@ -112,7 +112,7 @@ layout:
   article_width: 80rem
   sidebar_width: 8rem
 
-# 评论：1、Valine(推荐)；2、Gitalk
+# 评论：1、Valine(推荐)；2、Gitalk；3、MiniValine
 
 # 1、Valine[一款快速、简洁且高效的无后端评论系统](https://github.com/xCss/Valine)
 # 启用Valine必须先创建leancloud应用， 获取 id|key 填入即可
@@ -135,6 +135,20 @@ gitalk:
   owner: # GitHub ID
   admin: # GitHub ID
 
+# 3、MiniValine
+# See: https://github.com/MiniValine/MiniValine
+minivaline:
+  enable: true
+  placeholder: Write a Comment # Comment box placeholder
+  adminEmailMd5: # The MD5 of Admin Email to show Admin Flag.
+  math: true # Support MathJax.
+  md: true # Support Markdown.
+  # MiniValine's display language depends on user's browser or system environment
+  # If you want everyone visiting your site to see a uniform language, you can set a force language value
+  # Available values: en  | zh-CN | (and many more)
+  # More i18n info: https://github.com/MiniValine/minivaline-i18n
+  lang:
+
 # GitHub Ribbons-封面右上角的forkme，换样式直接在source/images目录下替换forkme图片
 github:
   # (关闭请设置为false)

layout/_partial/article.ejs

@@ -1,42 +1,35 @@
-<article id="<%= post.layout %>-<%= post.slug %>" class="article article-type-<%= post.layout %>" itemscope
+<article
-  itemprop="blogPost" data-scroll-reveal>
+  id="<%= post.layout %>-<%= post.slug %>"
-
+  class="article article-type-<%= post.layout %>"
+  itemscope
+  itemprop="blogPost"
+  data-scroll-reveal
+>
   <div class="article-inner">
     <% if (post.link || post.title){ %>
     <header class="article-header">
       <%- partial('post/title', {class_name: 'article-title'}) %>
     </header>
-    <% } %>
+    <% } %> <% if (index || is_post()) { %>
-
-    <% if (index || is_post()) { %>
     <div class="article-meta">
-      <%- partial('post/date', {class_name: 'article-date', date_format: null}) %>
+      <%- partial('post/date', {class_name: 'article-date', date_format: null})
-      <%- partial('post/category') %>
+      %> <%- partial('post/category') %> <% if(theme.word_count &&
-      <% if(theme.word_count && theme.word_count.enable && !post.no_word_count){%>
+      theme.word_count.enable && !post.no_word_count){%> <%-
-      <%- partial('post/word') %>
+      partial('post/word') %> <% } %>
-      <% } %>
     </div>
-    <% } %>
+    <% } %> <% if (theme.toc && is_post()){ %> <%- partial('post/tocbot') %> <%
-
+    } %> <% if (theme.excerpt_all&&index){ %> <% }else{ %>
-    <% if (theme.toc && is_post()){ %>
-    <%- partial('post/tocbot') %>
-    <% } %>
-
-    <% if (theme.excerpt_all&&index){ %>
-    <% }else{ %>
     <div class="article-entry" itemprop="articleBody">
-      <%- partial('post/justifiedGallery') %>
+      <%- partial('post/justifiedGallery') %> <%- partial('post/gallery') %> <%
-      <%- partial('post/gallery') %>
+      if (post.excerpt && index){ %> <%- post.excerpt %> <% if
-      <% if (post.excerpt && index){ %>
+      (theme.excerpt_link){ %>
-      <%- post.excerpt %>
+      <a class="article-more-link" href="<%- url_for(post.path) %>"
-      <% if (theme.excerpt_link){ %>
+        ><%= theme.excerpt_link %></a
-      <a class="article-more-link" href="<%- url_for(post.path) %>"><%= theme.excerpt_link %></a>
+      >
-      <% } %>
+      <% } %> <% } else { %> <%- post.content %> <% } %>
-      <% } else { %>
-      <%- post.content %>
-      <% } %>
       <!-- reward -->
-      <% if ((theme.reward_type === 2 || (theme.reward_type === 1 && post.reward)) && !index && !post.no_reward){ %>
+      <% if ((theme.reward_type === 2 || (theme.reward_type === 1 &&
+      post.reward)) && !index && !post.no_reward){ %>
       <div id="reward-btn">
         <%= __('post.reward') %>
       </div>
@@ -45,7 +38,8 @@
     <% } %>
 
     <!-- copyright -->
-      <% if (((theme.copyright_type === 2) || (theme.copyright_type === 1 && post.copyright)) && !index){ %>
+    <% if (((theme.copyright_type === 2) || (theme.copyright_type === 1 &&
+    post.copyright)) && !index){ %>
     <div class="declare">
       <ul class="post-copyright">
         <li>
@@ -57,29 +51,15 @@
     </div>
     <% } %>
     <footer class="article-footer">
-      <% if (!index && theme.share_enable){ %>
+      <% if (!index && theme.share_enable){ %> <%- partial('post/share') %> <% }
-          <%- partial('post/share') %>
+      %> <%- partial('post/tag') %>
-      <% } %>
-      <%- partial('post/tag') %>
-
     </footer>
-
   </div>
 
-  <% if (!index){ %>
+  <% if (!index){ %> <%- partial('post/nav') %> <% } %> <% if (theme.valine &&
-  <%- partial('post/nav') %>
+  theme.valine.enable && !post.no_valine){ %> <%- partial('post/valine', { key:
-  <% } %>
+  post.slug, title: post.title, url: config.url+url_for(post.path) }) %> <% } %>
-
+  <% if (is_post()) { %> <%- partial('post/gitalk') %> <% } %> <% if
-  <% if (theme.valine && theme.valine.enable && !post.no_valine){ %>
+  (theme.minivaline && theme.minivaline.enable && !post.no_minivaline){ %> <%-
-  <%- partial('post/valine', {
+  partial('post/minivaline') %> <% } %>
-            key: post.slug,
-            title: post.title,
-            url: config.url+url_for(post.path)
-          }) %>
-  <% } %>
-
-  <% if (is_post()) { %>
-  <%- partial('post/gitalk') %>
-  <% } %>
-
 </article>

layout/_partial/post/minivaline.ejs

@@ -0,0 +1,48 @@
+<% if (!index && theme.leancloud && theme.leancloud.enable){ %>
+<!-- minivaline评论 -->
+<div id="mvcomments-box">
+  <div id="mvcomments"></div>
+</div>
+<script src="https://cdn.jsdelivr.net/npm/minivaline/dist/MiniValine.min.js"></script>
+<script>
+  new MiniValine({
+    el: '#mvcomments',
+    appId: '<%- theme.leancloud.app_id %>',
+    appKey: '<%- theme.leancloud.app_key %>',
+    placeholder: '<%- theme.minivaline.placeholder %>',
+    lang: '<%- theme.minivaline.lang %>',
+    adminEmailMd5: '<%- theme.minivaline.adminEmailMd5 %>',
+    math: <%- theme.minivaline.math %>,
+    md: <%- theme.minivaline.md %>
+  });
+  const infoEle = document.querySelector('#mvcomments .info');
+  if (infoEle && infoEle.childNodes && infoEle.childNodes.length > 0) {
+      infoEle.childNodes.forEach(function (item) {
+          item.parentNode.removeChild(item);
+      });
+  }
+</script>
+<style>
+  #mvcomments-box {
+    padding: 5px 30px;
+  }
+
+  @media screen and (max-width: 800px) {
+    #mvcomments-box {
+      padding: 5px 0px;
+    }
+  }
+
+  #mvcomments-box #mvcomments {
+    background-color: #fff;
+  }
+
+  .v .vlist .vcard .vh {
+    padding-right: 20px;
+  }
+
+  .v .vlist .vcard {
+    padding-left: 10px;
+  }
+</style>
+<% } %>