From 060defa47587bdcf481f702679f6f699f51e58ba Mon Sep 17 00:00:00 2001 From: pai233 Date: Wed, 4 May 2022 12:44:39 +0800 Subject: [PATCH 01/11] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0Remark42?= =?UTF-8?q?=E8=AF=84=E8=AE=BA=E6=94=AF=E6=8C=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- _config.yml | 11 +++++- .../includes/third-party/comments/index.pug | 4 ++- layout/includes/third-party/comments/js.pug | 2 ++ .../third-party/comments/remark42.pug | 34 +++++++++++++++++++ 4 files changed, 49 insertions(+), 2 deletions(-) create mode 100644 layout/includes/third-party/comments/remark42.pug diff --git a/_config.yml b/_config.yml index 299f671..c2b0c2a 100644 --- a/_config.yml +++ b/_config.yml @@ -259,7 +259,7 @@ addtoany: comments: # Up to two comments system, the first will be shown as default - # Choose: Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus + # Choose: Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42 use: # Valine,Disqus text: true # Display the comment name next to the button # lazyload: The comment system will be load when comment element enters the browser's viewport. @@ -354,6 +354,15 @@ giscus: dark: dark option: +# Remark42 +# https://remark42.com/docs/getting-started/installation/ +remark42: + host: # required + siteId: remark # Your Site ID + language: en # https://remark42.com/docs/configuration/frontend/#locales + showEmailSubscription: true + simpleView: false + # Chat Services # -------------------------------------- diff --git a/layout/includes/third-party/comments/index.pug b/layout/includes/third-party/comments/index.pug index 6c725d6..dc99719 100644 --- a/layout/includes/third-party/comments/index.pug +++ b/layout/includes/third-party/comments/index.pug @@ -34,9 +34,11 @@ hr when 'Waline' #waline-wrap when 'Giscus' - #giscus-wrap + #giscus-wrap when 'Facebook Comments' .fb-comments(data-colorscheme = theme.display_mode === 'dark' ? 'dark' : 'light' data-numposts= theme.facebook_comments.pageSize || 10 data-order-by= theme.facebook_comments.order_by || 'social' data-width="100%") + when 'Remark42' + #remark42 diff --git a/layout/includes/third-party/comments/js.pug b/layout/includes/third-party/comments/js.pug index 1acd8d3..ff6f07b 100644 --- a/layout/includes/third-party/comments/js.pug +++ b/layout/includes/third-party/comments/js.pug @@ -20,3 +20,5 @@ each name in theme.comments.use !=partial('includes/third-party/comments/giscus', {}, {cache: true}) when 'Facebook Comments' !=partial('includes/third-party/comments/facebook_comments', {}, {cache: true}) + when 'Remark42' + !=partial('includes/third-party/comments/remark42', {}, {cache: true}) diff --git a/layout/includes/third-party/comments/remark42.pug b/layout/includes/third-party/comments/remark42.pug new file mode 100644 index 0000000..d6bae0d --- /dev/null +++ b/layout/includes/third-party/comments/remark42.pug @@ -0,0 +1,34 @@ +- const { host, siteId, language } = theme.remark42 +script. + var remark_config = { + host: '!{host}', + site_id: '!{siteId}', + components: ['embed'], + locale: '!{language}', + show_email_subscription: #{theme.remark42.showEmailSubscription}, + simple_view: #{theme.remark42.simpleView} + } + +script. + function loadRemark42(){ + !(function (e, n) { + for (var o = 0; o < e.length; o++) { + var r = n.createElement('script'), + c = '.js', + d = n.head || n.body + 'noModule' in r ? ((r.type = 'module'), (c = '.mjs')) : (r.async = !0), + (r.defer = !0), + (r.src = remark_config.host + '/web/' + e[o] + c), + d.appendChild(r) + } + })(remark_config.components || ['embed'], document) + } + + if ('!{theme.comments.use[0]}' === 'Remark42' || !!{theme.comments.lazyload}) { + if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('remark42'), loadRemark42) + else loadRemark42() + } else { + function loadOtherComment () { + loadRemark42() + } + } \ No newline at end of file From 41ac7f170c59534f4ff1c0fef2da5dfa25a12d5c Mon Sep 17 00:00:00 2001 From: pai233 Date: Wed, 11 May 2022 09:26:19 +0800 Subject: [PATCH 02/11] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0Remark42?= =?UTF-8?q?=E8=AF=84=E8=AE=BA=E7=B3=BB=E7=BB=9F=E4=B8=BB=E9=A2=98=E8=89=B2?= =?UTF-8?q?=E9=80=82=E5=BA=94=20feat:=20=E5=A2=9E=E5=8A=A0Remark42?= =?UTF-8?q?=E4=B8=BB=E9=A2=98=E8=AF=84=E8=AE=BA=E7=B3=BB=E7=BB=9F=E8=87=AA?= =?UTF-8?q?=E5=AE=9A=E4=B9=89=E6=98=BE=E7=A4=BA=E8=AF=84=E8=AE=BA=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- _config.yml | 1 + layout/includes/third-party/comments/remark42.pug | 12 ++++++++++++ 2 files changed, 13 insertions(+) diff --git a/_config.yml b/_config.yml index c2b0c2a..81a3222 100644 --- a/_config.yml +++ b/_config.yml @@ -362,6 +362,7 @@ remark42: language: en # https://remark42.com/docs/configuration/frontend/#locales showEmailSubscription: true simpleView: false + maxShownComments: 15 # Chat Services # -------------------------------------- diff --git a/layout/includes/third-party/comments/remark42.pug b/layout/includes/third-party/comments/remark42.pug index d6bae0d..e2c8b8c 100644 --- a/layout/includes/third-party/comments/remark42.pug +++ b/layout/includes/third-party/comments/remark42.pug @@ -1,11 +1,13 @@ - const { host, siteId, language } = theme.remark42 script. + let nowTheme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light' var remark_config = { host: '!{host}', site_id: '!{siteId}', components: ['embed'], locale: '!{language}', show_email_subscription: #{theme.remark42.showEmailSubscription}, + theme: nowTheme, simple_view: #{theme.remark42.simpleView} } @@ -24,6 +26,16 @@ script. })(remark_config.components || ['embed'], document) } + function changeRemark42Theme(){ + let theme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'light' : 'dark' + window.REMARK42.changeTheme(theme) + } + + let themeBtn = document.getElementById('darkmode') + themeBtn.addEventListener('click',()=>{ + changeRemark42Theme() + }) + if ('!{theme.comments.use[0]}' === 'Remark42' || !!{theme.comments.lazyload}) { if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('remark42'), loadRemark42) else loadRemark42() From 7187a178968b93ce8e707112388bc87c35032ea1 Mon Sep 17 00:00:00 2001 From: pai233 Date: Wed, 11 May 2022 09:31:51 +0800 Subject: [PATCH 03/11] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0Remark42?= =?UTF-8?q?=E9=85=8D=E7=BD=AE=E8=AF=B4=E6=98=8E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- _config.yml | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/_config.yml b/_config.yml index 81a3222..9a785cc 100644 --- a/_config.yml +++ b/_config.yml @@ -357,12 +357,12 @@ giscus: # Remark42 # https://remark42.com/docs/getting-started/installation/ remark42: - host: # required - siteId: remark # Your Site ID + host: # Your Host URL/你的Remark42的部署地址 + siteId: remark # Your Site ID/你的站点ID language: en # https://remark42.com/docs/configuration/frontend/#locales - showEmailSubscription: true - simpleView: false - maxShownComments: 15 + showEmailSubscription: true # Show Email Subscription/是否显示邮件订阅 + simpleView: false # Turn On the Simple View Mode/简单模式 + maxShownComments: 15 # The Max Shown Comments When the System loaded/默认加载时评论的显示数量 # Chat Services # -------------------------------------- From f768d6fce0f2a40aa1d55130da9feef301f8d722 Mon Sep 17 00:00:00 2001 From: pai233 Date: Wed, 11 May 2022 09:35:39 +0800 Subject: [PATCH 04/11] =?UTF-8?q?=E5=88=A0=E9=99=A4=E4=B8=8D=E5=BF=85?= =?UTF-8?q?=E8=A6=81=E7=9A=84=E7=A9=BA=E6=A0=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- layout/includes/third-party/comments/index.pug | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/layout/includes/third-party/comments/index.pug b/layout/includes/third-party/comments/index.pug index dc99719..c65a37d 100644 --- a/layout/includes/third-party/comments/index.pug +++ b/layout/includes/third-party/comments/index.pug @@ -34,7 +34,7 @@ hr when 'Waline' #waline-wrap when 'Giscus' - #giscus-wrap + #giscus-wrap when 'Facebook Comments' .fb-comments(data-colorscheme = theme.display_mode === 'dark' ? 'dark' : 'light' data-numposts= theme.facebook_comments.pageSize || 10 From c68e872f0e5ab1d8f10f5d82af1c7ffcafa2412c Mon Sep 17 00:00:00 2001 From: pai233 Date: Wed, 11 May 2022 13:47:54 +0800 Subject: [PATCH 05/11] =?UTF-8?q?feat:=20=E5=B0=86Remark42=E7=9A=84?= =?UTF-8?q?=E5=8F=AF=E9=80=89=E9=85=8D=E7=BD=AE=E5=BD=92=E5=85=A5option?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- _config.yml | 4 +--- layout/includes/third-party/comments/remark42.pug | 9 +++------ 2 files changed, 4 insertions(+), 9 deletions(-) diff --git a/_config.yml b/_config.yml index 9a785cc..773c7fa 100644 --- a/_config.yml +++ b/_config.yml @@ -360,9 +360,7 @@ remark42: host: # Your Host URL/你的Remark42的部署地址 siteId: remark # Your Site ID/你的站点ID language: en # https://remark42.com/docs/configuration/frontend/#locales - showEmailSubscription: true # Show Email Subscription/是否显示邮件订阅 - simpleView: false # Turn On the Simple View Mode/简单模式 - maxShownComments: 15 # The Max Shown Comments When the System loaded/默认加载时评论的显示数量 + option: # Chat Services # -------------------------------------- diff --git a/layout/includes/third-party/comments/remark42.pug b/layout/includes/third-party/comments/remark42.pug index e2c8b8c..378ee55 100644 --- a/layout/includes/third-party/comments/remark42.pug +++ b/layout/includes/third-party/comments/remark42.pug @@ -1,15 +1,12 @@ -- const { host, siteId, language } = theme.remark42 +- const { host, siteId, language, option } = theme.remark42 script. let nowTheme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light' - var remark_config = { + var remark_config = Object.assign({ host: '!{host}', site_id: '!{siteId}', components: ['embed'], locale: '!{language}', - show_email_subscription: #{theme.remark42.showEmailSubscription}, - theme: nowTheme, - simple_view: #{theme.remark42.simpleView} - } + },!{JSON.stringify(option)}) script. function loadRemark42(){ From 1f3f2f471bd5826a71025d8ea20fc31e51aab45a Mon Sep 17 00:00:00 2001 From: pai233 Date: Thu, 12 May 2022 08:39:56 +0800 Subject: [PATCH 06/11] =?UTF-8?q?feat:=20Remark42=E8=AF=84=E8=AE=BA?= =?UTF-8?q?=E6=94=AF=E6=8C=81=E6=98=BE=E7=A4=BA=E6=96=87=E7=AB=A0=E8=AF=84?= =?UTF-8?q?=E8=AE=BA=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- layout/includes/header/post-info.pug | 6 +++++- layout/includes/mixins/post-ui.pug | 4 ++++ .../third-party/card-post-count/index.pug | 4 +++- .../third-party/card-post-count/remark42.pug | 21 +++++++++++++++++++ .../third-party/comments/remark42.pug | 2 +- 5 files changed, 34 insertions(+), 3 deletions(-) create mode 100644 layout/includes/third-party/card-post-count/remark42.pug diff --git a/layout/includes/header/post-info.pug b/layout/includes/header/post-info.pug index 3293697..6993123 100644 --- a/layout/includes/header/post-info.pug +++ b/layout/includes/header/post-info.pug @@ -116,4 +116,8 @@ when 'Facebook Comments' +countBlock a(href=url_for(page.path) + '#post-comment') - span.fb-comments-count(data-href=urlNoIndex()) \ No newline at end of file + span.fb-comments-count(data-href=urlNoIndex()) + when 'Remark42' + +countBlock + a(href=url_for(page.path) + '#post-comment') + span(class="remark42__counter" data-url=urlNoIndex()) \ No newline at end of file diff --git a/layout/includes/mixins/post-ui.pug b/layout/includes/mixins/post-ui.pug index d2cb014..d3bf406 100644 --- a/layout/includes/mixins/post-ui.pug +++ b/layout/includes/mixins/post-ui.pug @@ -88,6 +88,10 @@ mixin postUI(posts) +countBlockInIndex a(href=url_for(link) + '#post-comment') span.fb-comments-count(data-href=urlNoIndex(article.permalink)) + when 'Remark42' + +countBlockInIndex + a(href=url_for(link) + '#post-comment') + span(class="remark42__counter" data-url=urlNoIndex(article.permalink)) //- Display the article introduction on homepage case theme.index_post_content.method diff --git a/layout/includes/third-party/card-post-count/index.pug b/layout/includes/third-party/card-post-count/index.pug index 44839b3..195d9ec 100644 --- a/layout/includes/third-party/card-post-count/index.pug +++ b/layout/includes/third-party/card-post-count/index.pug @@ -9,4 +9,6 @@ case theme.comments.use[0] when 'Waline' include ./waline.pug when 'Facebook Comments' - include ./fb.pug \ No newline at end of file + include ./fb.pug + when 'Remark42' + include ./remark42.pug \ No newline at end of file diff --git a/layout/includes/third-party/card-post-count/remark42.pug b/layout/includes/third-party/card-post-count/remark42.pug new file mode 100644 index 0000000..7de001b --- /dev/null +++ b/layout/includes/third-party/card-post-count/remark42.pug @@ -0,0 +1,21 @@ +- const { host, siteId, language, option } = theme.remark42 + +script. + let nowTheme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light' + var remark_config = Object.assign({ + host: '!{host}', + site_id: '!{siteId}', + components: ['counter'] + },!{JSON.stringify(option)}) + +script. + function loadRemark42(){ + !function(e,r){ + for(var o=r.head||r.body,n=0;n Date: Thu, 12 May 2022 20:56:46 +0800 Subject: [PATCH 07/11] Update index.pug --- layout/includes/third-party/card-post-count/index.pug | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/layout/includes/third-party/card-post-count/index.pug b/layout/includes/third-party/card-post-count/index.pug index 195d9ec..0c12d82 100644 --- a/layout/includes/third-party/card-post-count/index.pug +++ b/layout/includes/third-party/card-post-count/index.pug @@ -10,5 +10,5 @@ case theme.comments.use[0] include ./waline.pug when 'Facebook Comments' include ./fb.pug - when 'Remark42' - include ./remark42.pug \ No newline at end of file + when 'Remark42' + include ./remark42.pug From cbf52c3053813ede7d63ce282eeab8efc74fe226 Mon Sep 17 00:00:00 2001 From: pai233 Date: Fri, 13 May 2022 10:22:16 +0800 Subject: [PATCH 08/11] =?UTF-8?q?feat:=20Remark42=E6=94=AF=E6=8C=81?= =?UTF-8?q?=E6=98=BE=E7=A4=BA=E6=9C=80=E6=96=B0=E8=AF=84=E8=AE=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../third-party/newest-comments/index.pug | 4 +- .../third-party/newest-comments/remark42.pug | 92 +++++++++++++++++++ 2 files changed, 95 insertions(+), 1 deletion(-) create mode 100644 layout/includes/third-party/newest-comments/remark42.pug diff --git a/layout/includes/third-party/newest-comments/index.pug b/layout/includes/third-party/newest-comments/index.pug index 190e81a..826ccff 100644 --- a/layout/includes/third-party/newest-comments/index.pug +++ b/layout/includes/third-party/newest-comments/index.pug @@ -23,4 +23,6 @@ if use include ./github-issues.pug when 'Utterances' - userRepo = theme.utterances.repo - include ./github-issues.pug \ No newline at end of file + include ./github-issues.pug + when 'Remark42' + include ./remark42.pug \ No newline at end of file diff --git a/layout/includes/third-party/newest-comments/remark42.pug b/layout/includes/third-party/newest-comments/remark42.pug new file mode 100644 index 0000000..4b44095 --- /dev/null +++ b/layout/includes/third-party/newest-comments/remark42.pug @@ -0,0 +1,92 @@ +- const { host, siteId } = theme.remark42 +- const { limit } = theme.newest_comments + +script. + window.addEventListener('load', () => { + const api = ['!{host}','/api/v1/last/','!{limit}','?site=','!{siteId}'].join('') + + const changeContent = (content) => { + if (content === '') return content + + content = content.replace(/]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link + content = content.replace(/]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url + content = content.replace(/
.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
+            content = content.replace(/<[^>]+>/g,"") // remove html tag
+
+            if (content.length > 150) {
+                content = content.substring(0,150) + '...'
+            }
+            return content
+        }
+
+        const getComment = () => {
+            try {
+                let request = new XMLHttpRequest()
+                request.open("GET",api)
+                request.send(null)
+                request.onload = () => {
+                    if (request.status == 200) {
+                        const commentsData = JSON.parse(request.responseText)
+                        const commentsArray = commentsData.map(k => {
+                            return {
+                                'content': changeContent(k.text), //Maybe we can use e.orig
+                                'avatar': k.user.picture,
+                                'nick': k.user.name,
+                                'url': k.locator.url,
+                                'date': new Date(k.time).toISOString()
+                            }
+                        })
+
+                        saveToLocal.set('remark42-newest-comments', JSON.stringify(commentsArray), !{theme.newest_comments.storage}/(60*24))
+                        generateHtml(commentsArray)
+                    } else {
+                        throw Error("Request to Remark42 Failed")
+                    }
+                }
+            } catch(e) {
+                const $dom = document.querySelector('#card-newest-comments .aside-list')
+                $dom.innerHTML= "!{_p('aside.card_newest_comments.error')}"
+            }
+        }
+
+        const generateHtml = array => {
+            let result = ''
+
+            if (array.length) {
+                for (let i = 0; i < array.length; i++) {
+                result += '
'
+
+                if (!{theme.newest_comments.avatar}) {
+                    const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}'
+                    result += `${array[i].nick}`
+                }
+                
+                result += `

+                ${array[i].content}
+                
${array[i].nick} / 

+                
`
+                }
+            } else {
+                result += '!{_p("aside.card_newest_comments.zero")}'
+            }
+
+            let $dom = document.querySelector('#card-newest-comments .aside-list')
+            $dom.innerHTML= result
+            window.lazyLoadInstance && window.lazyLoadInstance.update()
+            window.pjax && window.pjax.refresh($dom)
+        }
+
+        const newestCommentInit = () => {
+            if (document.querySelector('#card-newest-comments .aside-list')) {
+                const data = saveToLocal.get('remark42-newest-comments')
+                if (data) {
+                    generateHtml(JSON.parse(data))
+                } else {
+                    getComment()
+                }
+            }
+        }
+
+        newestCommentInit()
+        document.addEventListener('pjax:complete', newestCommentInit)
+    })
\ No newline at end of file

From 4df78b1966a5aca9c80656076e5981fbe883f39b Mon Sep 17 00:00:00 2001
From: Jerry Wong 
Date: Tue, 17 May 2022 16:03:25 +0800
Subject: [PATCH 09/11] fix pjax

---
 README.md                                     |   2 +-
 README_CN.md                                  |   2 +-
 _config.yml                                   |   7 +-
 layout/includes/header/post-info.pug          |   2 +-
 layout/includes/mixins/post-ui.pug            |   2 +-
 .../third-party/card-post-count/index.pug     |   2 +-
 .../third-party/card-post-count/remark42.pug  |  27 ++--
 .../includes/third-party/comments/index.pug   |   2 +-
 layout/includes/third-party/comments/js.pug   |   2 +-
 .../third-party/comments/remark42.pug         |  94 ++++++-----
 .../third-party/newest-comments/remark42.pug  | 148 ++++++++----------
 11 files changed, 149 insertions(+), 141 deletions(-)

diff --git a/README.md b/README.md
index a7018ad..2c7c7b2 100644
--- a/README.md
+++ b/README.md
@@ -79,7 +79,7 @@ npm i hexo-theme-butterfly
 - [x] Related articles
 - [x] Displays outdated notice for a post
 - [x] Share (AddThis/Sharejs/Addtoany)
-- [X] Comment (Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus)
+- [X] Comment (Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42)
 - [x] Multiple Comment System Support
 - [x] Online Chats (Chatra/Tidio/Daovoice/Gitter/Crisp)
 - [x] Web analytics
diff --git a/README_CN.md b/README_CN.md
index c19ef07..c98ef14 100644
--- a/README_CN.md
+++ b/README_CN.md
@@ -79,7 +79,7 @@ theme: butterfly
 - [x] 顯示相關文章
 - [x] 過期文章提醒
 - [x] 多種分享系統（AddThis/Sharejs/Addtoany）
-- [X] 多種評論系統（Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus）
+- [X] 多種評論系統（Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42）
 - [x] 支持雙評論部署
 - [x] 多種在線聊天（Chatra/Tidio/Daovoice/Gitter/Crisp）
 - [x] 多種分析系統
diff --git a/_config.yml b/_config.yml
index 773c7fa..4774408 100644
--- a/_config.yml
+++ b/_config.yml
@@ -355,11 +355,10 @@ giscus:
   option:
 
 # Remark42
-# https://remark42.com/docs/getting-started/installation/
+# https://remark42.com/docs/configuration/frontend/
 remark42:
-  host: # Your Host URL/你的Remark42的部署地址
-  siteId: remark  # Your Site ID/你的站点ID 
-  language: en # https://remark42.com/docs/configuration/frontend/#locales
+  host: # Your Host URL
+  siteId: # Your Site ID
   option:
 
 # Chat Services
diff --git a/layout/includes/header/post-info.pug b/layout/includes/header/post-info.pug
index 6993123..8cabfe7 100644
--- a/layout/includes/header/post-info.pug
+++ b/layout/includes/header/post-info.pug
@@ -120,4 +120,4 @@
           when 'Remark42'
             +countBlock
               a(href=url_for(page.path) + '#post-comment')
-                span(class="remark42__counter" data-url=urlNoIndex())      
\ No newline at end of file
+                span.remark42__counter(data-url=urlNoIndex())
\ No newline at end of file
diff --git a/layout/includes/mixins/post-ui.pug b/layout/includes/mixins/post-ui.pug
index d3bf406..9ef2e00 100644
--- a/layout/includes/mixins/post-ui.pug
+++ b/layout/includes/mixins/post-ui.pug
@@ -91,7 +91,7 @@ mixin postUI(posts)
               when 'Remark42'
                 +countBlockInIndex
                   a(href=url_for(link) + '#post-comment')
-                    span(class="remark42__counter" data-url=urlNoIndex(article.permalink))
+                    span.remark42__counter(data-url=urlNoIndex(article.permalink))
 
         //- Display the article introduction on homepage
         case theme.index_post_content.method
diff --git a/layout/includes/third-party/card-post-count/index.pug b/layout/includes/third-party/card-post-count/index.pug
index 0c12d82..0abc970 100644
--- a/layout/includes/third-party/card-post-count/index.pug
+++ b/layout/includes/third-party/card-post-count/index.pug
@@ -11,4 +11,4 @@ case theme.comments.use[0]
   when 'Facebook Comments'
     include ./fb.pug
   when 'Remark42'
-    include ./remark42.pug
+    include ./remark42.pug
\ No newline at end of file
diff --git a/layout/includes/third-party/card-post-count/remark42.pug b/layout/includes/third-party/card-post-count/remark42.pug
index 7de001b..b67164f 100644
--- a/layout/includes/third-party/card-post-count/remark42.pug
+++ b/layout/includes/third-party/card-post-count/remark42.pug
@@ -1,21 +1,18 @@
-- const { host, siteId, language, option } = theme.remark42
+- const { host, siteId, option } = theme.remark42
 
 script.
-    let nowTheme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'
-    var remark_config = Object.assign({
-        host: '!{host}',
-        site_id: '!{siteId}',
-        components: ['counter']
+  (()=>{
+    window.remark_config = Object.assign({
+      host: '!{host}',
+      site_id: '!{siteId}',
     },!{JSON.stringify(option)})
 
-script.
-    function loadRemark42(){
-        !function(e,r){
-            for(var o=r.head||r.body,n=0;n{
-        changeRemark42Theme()
-    })
+  function getCount () {
+    const ele = document.querySelector('.remark42__counter')
+    if (ele) {
+      const s = document.createElement('script')
+      s.src = remark_config.host + '/web/counter.js'
+      s.defer = true
+      document.head.appendChild(s)
+    }
+  }
 
-    if ('!{theme.comments.use[0]}' === 'Remark42' || !!{theme.comments.lazyload}) {
-        if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('remark42'), loadRemark42)
-        else loadRemark42()
+  function loadRemark42 () {
+    if (window.REMARK42) {
+      this.initRemark42()
+      getCount()
     } else {
-        function loadOtherComment () {
-            loadRemark42()
-        }
-    }
\ No newline at end of file
+      addRemark42()
+      window.addEventListener('REMARK42::ready', () => {
+        this.initRemark42()
+        getCount()
+      })
+    }
+  }
+
+  document.getElementById('darkmode').addEventListener('click',()=>{
+    if (!window.REMARK42) return
+    let theme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'light' : 'dark'
+    window.REMARK42.changeTheme(theme)
+  })
+
+  if ('!{theme.comments.use[0]}' === 'Remark42' || !!{theme.comments.lazyload}) {
+    if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('remark42'), loadRemark42)
+    else loadRemark42()
+  } else {
+    function loadOtherComment () {
+      loadRemark42()
+    }
+  }
diff --git a/layout/includes/third-party/newest-comments/remark42.pug b/layout/includes/third-party/newest-comments/remark42.pug
index 4b44095..d14adb9 100644
--- a/layout/includes/third-party/newest-comments/remark42.pug
+++ b/layout/includes/third-party/newest-comments/remark42.pug
@@ -1,92 +1,80 @@
 - const { host, siteId } = theme.remark42
-- const { limit } = theme.newest_comments
 
 script.
-    window.addEventListener('load', () => {
-        const api = ['!{host}','/api/v1/last/','!{limit}','?site=','!{siteId}'].join('')
+  window.addEventListener('load', () => {
+    const changeContent = (content) => {
+      if (content === '') return content
 
-        const changeContent = (content) => {
-            if (content === '') return content
+      content = content.replace(/]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link
+      content = content.replace(/]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url
+      content = content.replace(/
.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
+      content = content.replace(/<[^>]+>/g,"") // remove html tag
 
-            content = content.replace(/]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link
-            content = content.replace(/]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url
-            content = content.replace(/
.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
-            content = content.replace(/<[^>]+>/g,"") // remove html tag
+      if (content.length > 150) {
+        content = content.substring(0,150) + '...'
+      }
+      return content
+    }
 
-            if (content.length > 150) {
-                content = content.substring(0,150) + '...'
-            }
-            return content
+    const generateHtml = array => {
+      let result = ''
+
+      if (array.length) {
+        for (let i = 0; i < array.length; i++) {
+          result += '
'
+
+          if (!{theme.newest_comments.avatar}) {
+            const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}'
+            result += `${array[i].nick}`
+          }
+
+          result += `

+          ${array[i].content}
+          
${array[i].nick} / 

+          
`
         }
+      } else {
+        result += '!{_p("aside.card_newest_comments.zero")}'
+      }
 
-        const getComment = () => {
-            try {
-                let request = new XMLHttpRequest()
-                request.open("GET",api)
-                request.send(null)
-                request.onload = () => {
-                    if (request.status == 200) {
-                        const commentsData = JSON.parse(request.responseText)
-                        const commentsArray = commentsData.map(k => {
-                            return {
-                                'content': changeContent(k.text), //Maybe we can use e.orig
-                                'avatar': k.user.picture,
-                                'nick': k.user.name,
-                                'url': k.locator.url,
-                                'date': new Date(k.time).toISOString()
-                            }
-                        })
+      let $dom = document.querySelector('#card-newest-comments .aside-list')
+      $dom.innerHTML= result
+      window.lazyLoadInstance && window.lazyLoadInstance.update()
+      window.pjax && window.pjax.refresh($dom)
+    }
 
-                        saveToLocal.set('remark42-newest-comments', JSON.stringify(commentsArray), !{theme.newest_comments.storage}/(60*24))
-                        generateHtml(commentsArray)
-                    } else {
-                        throw Error("Request to Remark42 Failed")
-                    }
-                }
-            } catch(e) {
-                const $dom = document.querySelector('#card-newest-comments .aside-list')
-                $dom.innerHTML= "!{_p('aside.card_newest_comments.error')}"
+    const getComment = () => {
+      fetch('!{host}/api/v1/last/!{theme.newest_comments.limit}?site=!{siteId}')
+        .then(response => response.json())
+        .then(data => {
+          const remark42 = data.map(function (e) {
+            return {
+              'avatar': e.user.picture,
+              'content': changeContent(e.text),
+              'nick': e.user.name,
+              'url': e.locator.url,
+              'date': e.time,
             }
+          })
+          saveToLocal.set('remark42-newest-comments', JSON.stringify(remark42), !{theme.newest_comments.storage}/(60*24))
+          generateHtml(remark42)
+        }).catch(e => {
+          const $dom = document.querySelector('#card-newest-comments .aside-list')
+          $dom.innerHTML= "!{_p('aside.card_newest_comments.error')}"
+        })
+    }
+
+    const newestCommentInit = () => {
+      if (document.querySelector('#card-newest-comments .aside-list')) {
+        const data = saveToLocal.get('valine-newest-comments')
+        if (data) {
+          generateHtml(JSON.parse(data))
+        } else {
+          getComment()
         }
+      }
+    }
 
-        const generateHtml = array => {
-            let result = ''
-
-            if (array.length) {
-                for (let i = 0; i < array.length; i++) {
-                result += '
'
-
-                if (!{theme.newest_comments.avatar}) {
-                    const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}'
-                    result += `${array[i].nick}`
-                }
-                
-                result += `

-                ${array[i].content}
-                
${array[i].nick} / 

-                
`
-                }
-            } else {
-                result += '!{_p("aside.card_newest_comments.zero")}'
-            }
-
-            let $dom = document.querySelector('#card-newest-comments .aside-list')
-            $dom.innerHTML= result
-            window.lazyLoadInstance && window.lazyLoadInstance.update()
-            window.pjax && window.pjax.refresh($dom)
-        }
-
-        const newestCommentInit = () => {
-            if (document.querySelector('#card-newest-comments .aside-list')) {
-                const data = saveToLocal.get('remark42-newest-comments')
-                if (data) {
-                    generateHtml(JSON.parse(data))
-                } else {
-                    getComment()
-                }
-            }
-        }
-
-        newestCommentInit()
-        document.addEventListener('pjax:complete', newestCommentInit)
-    })
\ No newline at end of file
+    newestCommentInit()
+    document.addEventListener('pjax:complete', newestCommentInit)
+  })

From 08b7cd9dbbbd9010cac167ef1ca634d6a44c7c2f Mon Sep 17 00:00:00 2001
From: qsgy-edge <1794551825@qq.com>
Date: Fri, 20 May 2022 16:55:51 +0800
Subject: [PATCH 10/11] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=B3=BB=E5=88=97?=
 =?UTF-8?q?=E6=96=87=E7=AB=A0=E7=9B=AE=E5=BD=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layout/includes/head/config_site.pug        |  3 +++
 layout/includes/widget/card_series_post.pug | 15 +++++++++++++++
 layout/includes/widget/index.pug            |  2 ++
 3 files changed, 20 insertions(+)
 create mode 100644 layout/includes/widget/card_series_post.pug

diff --git a/layout/includes/head/config_site.pug b/layout/includes/head/config_site.pug
index 94cbb51..21caa1c 100644
--- a/layout/includes/head/config_site.pug
+++ b/layout/includes/head/config_site.pug
@@ -6,6 +6,9 @@
   else if (page.highlight_shrink === true || page.highlight_shrink === false) isHighlightShrink = page.highlight_shrink
   else isHighlightShrink = theme.highlight_shrink
 
+  if (page.series)
+    var Series = page.series
+
   var showToc = false
   if (theme.aside.enable && page.aside !== false) {
     let tocEnable = false
diff --git a/layout/includes/widget/card_series_post.pug b/layout/includes/widget/card_series_post.pug
new file mode 100644
index 0000000..9e3fd61
--- /dev/null
+++ b/layout/includes/widget/card_series_post.pug
@@ -0,0 +1,15 @@
+.card-widget(class='series_post' id='series_post')
+  .item-headline
+    i(class='fas fa-car-side')
+    span 系列文章 #{Series}
+  .item-content
+    - let list = site.posts.sort('date', -1)
+    ul(class='series_post_list')
+      - list.each(function(article){
+        if article.series == Series
+          - let link = article.link || article.path
+          - let title = article.title || _p('no_title')
+          li
+            a.title(href=url_for(link) title=title)= title
+      - })
+
diff --git a/layout/includes/widget/index.pug b/layout/includes/widget/index.pug
index 5f44ae9..94989f0 100644
--- a/layout/includes/widget/index.pug
+++ b/layout/includes/widget/index.pug
@@ -13,6 +13,8 @@
       .sticky_layout
         if showToc
           include ./card_post_toc.pug
+        if Series
+          include ./card_series_post.pug
         !=partial('includes/widget/card_recent_post', {}, {cache: true})
         !=partial('includes/widget/card_ad', {}, {cache: true})
   else

From e650f71086d262bf606f27b839a7041ff8d98481 Mon Sep 17 00:00:00 2001
From: Jerry Wong 
Date: Sun, 22 May 2022 00:02:14 +0800
Subject: [PATCH 11/11] =?UTF-8?q?Revert=20"Feat:=20=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E7=B3=BB=E5=88=97=E6=96=87=E7=AB=A0=E7=9B=AE=E5=BD=95"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layout/includes/head/config_site.pug        |  3 ---
 layout/includes/widget/card_series_post.pug | 15 ---------------
 layout/includes/widget/index.pug            |  2 --
 3 files changed, 20 deletions(-)
 delete mode 100644 layout/includes/widget/card_series_post.pug

diff --git a/layout/includes/head/config_site.pug b/layout/includes/head/config_site.pug
index 21caa1c..94cbb51 100644
--- a/layout/includes/head/config_site.pug
+++ b/layout/includes/head/config_site.pug
@@ -6,9 +6,6 @@
   else if (page.highlight_shrink === true || page.highlight_shrink === false) isHighlightShrink = page.highlight_shrink
   else isHighlightShrink = theme.highlight_shrink
 
-  if (page.series)
-    var Series = page.series
-
   var showToc = false
   if (theme.aside.enable && page.aside !== false) {
     let tocEnable = false
diff --git a/layout/includes/widget/card_series_post.pug b/layout/includes/widget/card_series_post.pug
deleted file mode 100644
index 9e3fd61..0000000
--- a/layout/includes/widget/card_series_post.pug
+++ /dev/null
@@ -1,15 +0,0 @@
-.card-widget(class='series_post' id='series_post')
-  .item-headline
-    i(class='fas fa-car-side')
-    span 系列文章 #{Series}
-  .item-content
-    - let list = site.posts.sort('date', -1)
-    ul(class='series_post_list')
-      - list.each(function(article){
-        if article.series == Series
-          - let link = article.link || article.path
-          - let title = article.title || _p('no_title')
-          li
-            a.title(href=url_for(link) title=title)= title
-      - })
-
diff --git a/layout/includes/widget/index.pug b/layout/includes/widget/index.pug
index 94989f0..5f44ae9 100644
--- a/layout/includes/widget/index.pug
+++ b/layout/includes/widget/index.pug
@@ -13,8 +13,6 @@
       .sticky_layout
         if showToc
           include ./card_post_toc.pug
-        if Series
-          include ./card_series_post.pug
         !=partial('includes/widget/card_recent_post', {}, {cache: true})
         !=partial('includes/widget/card_ad', {}, {cache: true})
   else