feat: 去除 jQuery (fancybox和圖庫仍需要加載jQuery)

feat: 點擊文字特效增加隨機配置 feat: 可配置是否添加css前綴 fix: 修復子目錄下，配置justifiedGallery CDN（相對鏈接）後，連接會無法訪問的bugs fix: 修復 pangu 配置post 後，仍在全站生效的bugs improvement: 夜間模式下，廣告降低亮度 improvement: 手機端toc邊距微調 improvement: html格式優化 improvement: 搜索優化 improvement: 刪除不必要的語言文件
2026-04-17 04:40:53 +08:00 · 2020-11-21 00:27:01 +08:00
parent 7f03c3f716
commit 88b1cc553c
64 changed files with 969 additions and 795 deletions
--- a/layout/includes/additional-js.pug
+++ b/layout/includes/additional-js.pug
@@ -1,5 +1,4 @@
 div
-  script(src=url_for(theme.CDN.jquery))
  script(src=url_for(theme.CDN.utils))
  script(src=url_for(theme.CDN.main))

@@ -8,11 +7,9 @@ div

  if theme.medium_zoom
    script(src=url_for(theme.CDN.medium_zoom))
-  else if theme.fancybox
-    script(src=url_for(theme.CDN.fancybox))

  if theme.instantpage
-    script(src=url_for(theme.CDN.instantpage) type="module" defer)
+    script(src=url_for(theme.CDN.instantpage) type="module")

  if theme.lazyload.enable
    script(src=url_for(theme.CDN.lazyload))
@@ -35,9 +32,6 @@ div
  .js-pjax
    if theme.subtitle.enable && is_home() && theme.index_img !== false
      include ./third-party/subtitle.pug
-    
-    if page.type === 'artitalk'
-      include ./third-party/artitalk.pug

    include ./third-party/math/index.pug

--- a/layout/includes/head.pug
+++ b/layout/includes/head.pug
@@ -53,9 +53,6 @@ if (theme.pwa && theme.pwa.enable)
 link(rel='stylesheet', href=url_for(theme.CDN.main_css))
 link(rel='stylesheet', href=url_for(theme.CDN.fontawesome))

-if theme.fancybox
-  link(rel='stylesheet', href=url_for(theme.CDN.fancybox_css))
-
 if (theme.snackbar && theme.snackbar.enable)
  link(rel='stylesheet', href=url_for(theme.CDN.snackbar_css))

--- a/layout/includes/head/config.pug
+++ b/layout/includes/head/config.pug
@@ -54,7 +54,8 @@
  if (theme.ClickShowText && theme.ClickShowText.enable) {
    ClickShowText = JSON.stringify({
    text: theme.ClickShowText.text.join(","),
-      fontSize: theme.ClickShowText.fontSize
+      fontSize: theme.ClickShowText.fontSize,
+      random: theme.ClickShowText.random
    })
  }

@@ -119,9 +120,16 @@ script.
    ClickShowText: !{ClickShowText},
    lightbox: '!{ theme.medium_zoom ? "mediumZoom" : (theme.fancybox ? "fancybox" : "null" )}',
    Snackbar: !{Snackbar},
-    justifiedGallery: {
-      js: '!{theme.CDN.justifiedGallery_js}',
-      css: '!{theme.CDN.justifiedGallery_css}'
+    source: {
+      jQuery: '!{url_for(theme.CDN.jquery)}',
+      justifiedGallery: {
+        js: '!{url_for(theme.CDN.justifiedGallery_js)}',
+        css: '!{url_for(theme.CDN.justifiedGallery_css)}'
+      },
+      fancybox: {
+        js: '!{url_for(theme.CDN.fancybox)}',
+        css: '!{url_for(theme.CDN.fancybox_css)}'
+      }
    },
    isPhotoFigcaption: !{theme.photofigcaption},
    islazyload: !{theme.lazyload.enable},
@@ -156,5 +164,17 @@ script.
    }
  }

-
-
+  // https://stackoverflow.com/questions/16839698/jquery-getscript-alternative-in-native-javascript
+  const getScript = url => new Promise((resolve, reject) => {
+    const script = document.createElement('script')
+    script.src = url
+    script.async = true
+    script.onerror = reject
+    script.onload = script.onreadystatechange = function() {
+      const loadState = this.readyState
+      if (loadState && loadState !== 'loaded' && loadState !== 'complete') return
+      script.onload = script.onreadystatechange = null
+      resolve()
+    }
+    document.head.appendChild(script)
+  })
--- a/layout/includes/head/preconnect.pug
+++ b/layout/includes/head/preconnect.pug
@@ -1,7 +1,7 @@
 link(rel="preconnect" href="//cdn.jsdelivr.net")

 if theme.google_analytics
-  link(rel="preconnect" href="//www.google-analytics.com" crossorigin)
+  link(rel="preconnect" href="//www.google-analytics.com" crossorigin='')

 if theme.baidu_analytics
  link(rel="preconnect" href="//hm.baidu.com")
@@ -13,7 +13,7 @@ if theme.cnzz_analytics
  link(rel="preconnect" href="//s4.cnzz.com")

 if theme.blog_title_font && theme.blog_title_font.font_link && theme.blog_title_font.font_link.indexOf('//fonts.googleapis.com') != -1
-  link(rel="preconnect" href="//fonts.googleapis.com" crossorigin)
+  link(rel="preconnect" href="//fonts.googleapis.com" crossorigin='')

 if theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv
  link(rel="preconnect" href="//busuanzi.ibruce.info")
--- a/layout/includes/header/nav.pug
+++ b/layout/includes/header/nav.pug
@@ -2,15 +2,15 @@ nav#nav
  span#blog_name
    a#site-name(href=url_for('/')) #[=config.title]
    
-  span#menus
+  #menus
    if (theme.algolia_search.enable || theme.local_search.enable)
-      #search_button
+      #search-button
        a.site-page.social-icon.search
          i.fas.fa-search.fa-fw
          span=' '+_p('search')
    !=fragment_cache('menus', function(){return partial('includes/header/menu_item')})

-    span#toggle-menu.close
+    #toggle-menu
      a.site-page
        i.fas.fa-bars.fa-fw

--- a/layout/includes/mixins/post-ui.pug
+++ b/layout/includes/mixins/post-ui.pug
@@ -78,4 +78,4 @@ mixin postUI(posts)

    if theme.ad && theme.ad.index
      if (index + 1) % 3 == 0
-        .recent-post-item.ad-height!=theme.ad.index
+        .recent-post-item.ads-wrap!=theme.ad.index
--- a/layout/includes/page/artitalk.pug
+++ b/layout/includes/page/artitalk.pug
@@ -1,4 +1,28 @@
+- let option = theme.artitalk.option ? JSON.stringify(theme.artitalk.option) : false
+
 if top_img === false
  h1.page-title= page.title

-#artitalk_main
+#artitalk_main
+script.
+  (()=>{
+    let setting = {
+      appId: '!{theme.artitalk.appId}',
+      appKey: '!{theme.artitalk.appKey}',
+    }
+
+    if (!{Boolean(option)}) {
+      const otherSetting = !{option}
+      setting = Object.assign({}, setting, otherSetting)
+    }
+
+    const init = () => {
+      new Artitalk(setting)
+    }
+
+    if (typeof Artitalk === 'function') {
+      init()
+    } else {
+      getScript('!{theme.CDN.artitalk}').then(init)
+    }
+  })()
--- a/layout/includes/pagination.pug
+++ b/layout/includes/pagination.pug
@@ -18,9 +18,9 @@ else
        - var pagination_cover = page.prev.cover === false ? page.prev.randomcover : page.prev.cover
        a(href=url_for(page.prev.path))
          if theme.lazyload.enable
-            img.prev-cover(data-lazy-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` )
+            img.prev-cover(data-lazy-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of previous post')
          else
-            img.prev-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` )
+            img.prev-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of previous post')
          .pagination-info
            .label=_p('pagination.prev')
            .prev_info=page.prev.title
@@ -31,9 +31,9 @@ else
      .next-post(class=hasPagePrev)
        a(href=url_for(page.next.path))
          if theme.lazyload.enable
-            img.next-cover(data-lazy-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'`)
+            img.next-cover(data-lazy-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of next post')
          else
-            img.next-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'`)
+            img.next-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of next post')
          .pagination-info
            .label=_p('pagination.next')
            .next_info=page.next.title 
--- a/layout/includes/third-party/artitalk.pug
+++ b/layout/includes/third-party/artitalk.pug
@@ -1,24 +0,0 @@
- let option = theme.artitalk.option ? JSON.stringify(theme.artitalk.option) : false
-
-script.
-  (()=>{
-    let setting = {
-      appId: '!{theme.artitalk.appId}',
-      appKey: '!{theme.artitalk.appKey}',
-    }
-
-    if (!{Boolean(option)}) {
-      const otherSetting = !{option}
-      setting = Object.assign({}, setting, otherSetting)
-    }
-
-    const init = () => {
-      new Artitalk(setting)
-    }
-
-    if (typeof Artitalk === 'function') {
-      init()
-    } else {
-      $.getScript('!{theme.CDN.artitalk}',init)
-    }
-  })()
--- a/layout/includes/third-party/baidu_push.pug
+++ b/layout/includes/third-party/baidu_push.pug
@@ -3,11 +3,11 @@ if theme.baidu_push
    (function(){
      const bp = document.createElement('script');
      const curProtocol = window.location.protocol.split(':')[0];
-      if (curProtocol === 'https'){
-      bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
+      if (curProtocol === 'https') {
+        bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
      }
      else{
-      bp.src = 'http://push.zhanzhang.baidu.com/push.js';
+        bp.src = 'http://push.zhanzhang.baidu.com/push.js';
      }
      bp.dataset.pjax = ''
      const s = document.getElementsByTagName("script")[0];
--- a/layout/includes/third-party/comments/disqusjs.pug
+++ b/layout/includes/third-party/comments/disqusjs.pug
@@ -29,7 +29,7 @@ script.
    if (window.disqusJsLoad) initDisqusjs()
    else {
      addDisqusjsCSS()
-      $.getScript('!{url_for(theme.CDN.disqusjs)}', initDisqusjs)
+      getScript('!{url_for(theme.CDN.disqusjs)}').then(initDisqusjs)
      window.disqusJsLoad = true
    }
  }
--- a/layout/includes/third-party/comments/gitalk.pug
+++ b/layout/includes/third-party/comments/gitalk.pug
@@ -28,7 +28,7 @@ script.
    if (typeof Gitalk === 'function') initGitalk()
    else {
      addGitalkSource()
-      $.getScript('!{url_for(theme.CDN.gitalk)}', initGitalk)
+      getScript('!{url_for(theme.CDN.gitalk)}').then(initGitalk)
    }
  }
  
--- a/layout/includes/third-party/comments/twikoo.pug
+++ b/layout/includes/third-party/comments/twikoo.pug
@@ -9,7 +9,7 @@ script.
    if (typeof twikoo.init === 'function') {
      init()
    } else {
-      $.getScript('!{theme.CDN.twikoo}', init)
+      getScript('!{theme.CDN.twikoo}').then(init)
    }
  }

--- a/layout/includes/third-party/comments/valine.pug
+++ b/layout/includes/third-party/comments/valine.pug
@@ -36,7 +36,7 @@ script.
    }

    if (typeof Valine === 'function') initValine() 
-    else $.getScript('!{url_for(theme.CDN.valine)}', initValine)
+    else getScript('!{url_for(theme.CDN.valine)}').then(initValine)
  }

  if ('!{theme.comments.use[0]}' === 'Valine' || !!{theme.comments.lazyload}) {
--- a/layout/includes/third-party/math/katex.pug
+++ b/layout/includes/third-party/math/katex.pug
@@ -2,6 +2,9 @@ link(rel="stylesheet" type="text/css" href=theme.CDN.katex)
 script(src=url_for(theme.CDN.katex_copytex))
 link(rel="stylesheet" type="text/css" href=theme.CDN.katex_copytex_css)
 script.
-  $(function () {
-    $('span.katex-display').wrap('<div class="katex-wrap"></div>')
-  })
+  (() => {
+    document.querySelectorAll('#article-container span.katex-display').forEach(item => {
+      btf.wrap(item, 'div', '', 'katex-wrap')
+    })
+  })()
+  
--- a/layout/includes/third-party/math/mermaid.pug
+++ b/layout/includes/third-party/math/mermaid.pug
@@ -2,7 +2,7 @@ script.
  if (document.getElementsByClassName('mermaid').length) {
    if (window.mermaidJsLoad) mermaid.init()
    else {
-      $.getScript('!{theme.CDN.mermaid}', function () {
+      getScript('!{theme.CDN.mermaid}').then(() => {
        window.mermaidJsLoad = true
        mermaid.initialize({
          theme: '!{theme.mermaid.theme}',
--- a/layout/includes/third-party/newest-comments/disqus-comment.pug
+++ b/layout/includes/third-party/newest-comments/disqus-comment.pug
@@ -14,24 +14,25 @@ script.
    }

    const getDisqusComment = () => {
-      let disqusArray = []
-      $.getJSON('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{theme.newest_comments.disqus.forum}&related=thread&limit=!{theme.newest_comments.limit}&api_key=!{theme.newest_comments.disqus.api_key}', function(data){
-        $.each(data.response, (i, item) => {
-          disqusArray.push({
-            'avatar': item.author.avatar.cache,
-            'content': changeContent(item.message),
-            'nick': item.author.name,
-            'url': item.url,
-            'date': item.createdAt
+      fetch('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{theme.newest_comments.disqus.forum}&related=thread&limit=!{theme.newest_comments.limit}&api_key=!{theme.newest_comments.disqus.api_key}')
+        .then(response => response.json())
+        .then(data => {
+          const disqusArray = data.response.map(item => {
+            return {
+              'avatar': item.author.avatar.cache,
+              'content': changeContent(item.message),
+              'nick': item.author.name,
+              'url': item.url,
+              'date': item.createdAt
+            }
          })
+          // set expiry to 10 min
+          saveToLocal.set('disqus-newest-comments', JSON.stringify(disqusArray), 10/(60*24))
+          generateHtml(disqusArray)
+        }).catch(e => {
+          const $dom = document.querySelector('#card-newest-comments .aside-list')
+          $dom.innerHTML= "!{_p('aside.card_newest_comments.error')}"
        })
-        // set expiry to 10 min
-        saveToLocal.set('disqus-newest-comments', JSON.stringify(disqusArray), 10/(60*24))
-        generateHtml(disqusArray)
-      }).fail(()=>{
-        const $dom = document.querySelector('#card-newest-comments .aside-list')
-        $dom.innerHTML= "!{_p('aside.card_newest_comments.error')}"
-      })
    }

    const generateHtml = array => {
--- a/layout/includes/third-party/newest-comments/github-issues.pug
+++ b/layout/includes/third-party/newest-comments/github-issues.pug
@@ -14,23 +14,24 @@ script.
    }

    const getGithubIssues = () => {
-      let githubArray = []
-      $.getJSON('https://api.github.com/repos/!{theme.newest_comments.github_issues.repo}/issues/comments?sort=updated&direction=desc&per_page=!{theme.newest_comments.limit}&page=1', (data) => { 
-        $.each(data, (index, item) => {
-          githubArray.push({
-            'avatar': item.user.avatar_url,
-            'content': changeContent(item.body),
-            'nick': item.user.login,
-            'url': item.html_url,
-            'date': item.updated_at
+      fetch('https://api.github.com/repos/!{theme.newest_comments.github_issues.repo}/issues/comments?sort=updated&direction=desc&per_page=!{theme.newest_comments.limit}&page=1')
+        .then(response => response.json())
+        .then(data => {
+          const githubArray = data.map(item => {
+            return {
+              'avatar': item.user.avatar_url,
+              'content': changeContent(item.body),
+              'nick': item.user.login,
+              'url': item.html_url,
+              'date': item.updated_at
+            }
          })
+          saveToLocal.set('github-newest-comments', JSON.stringify(githubArray), 10/(60*24))
+          generateHtml(githubArray)
+        }).catch(e => {
+          const $dom = document.querySelector('#card-newest-comments .aside-list')
+          $dom.innerHTML= "!{_p('aside.card_newest_comments.error')}"
        })
-        saveToLocal.set('github-newest-comments', JSON.stringify(githubArray), 10/(60*24))
-        generateHtml(githubArray)
-      }).fail(()=>{
-        const $dom = document.querySelector('#card-newest-comments .aside-list')
-        $dom.innerHTML= "!{_p('aside.card_newest_comments.error')}"
-      })
    }

    const generateHtml = array => {
--- a/layout/includes/third-party/newest-comments/leancloud.pug
+++ b/layout/includes/third-party/newest-comments/leancloud.pug
@@ -51,9 +51,7 @@ script.
        }

      var settings = {
-        "url": `${serverURL}/1.1/classes/Comment?limit=!{theme.newest_comments.limit}&order=-createdAt`,
        "method": "GET",
-        "timeout": 0,
        "headers": {
          "X-LC-Id": '!{theme.newest_comments.leancloud.appId}',
          "X-LC-Key": '!{theme.newest_comments.leancloud.appKey}',
@@ -61,26 +59,25 @@ script.
        },
      }

-      $.ajax(settings).done((response) => {
-        var valineArray = []
-        response.results.forEach((e)=>{
-          valineArray.push({
-            'avatar': e.QQAvatar,
-            'content': changeContent(e.comment),
-            'mail': e.mail,
-            'nick': e.nick,
-            'url': e.url,
-            'date': e.createdAt,
+      fetch(`${serverURL}/1.1/classes/Comment?limit=!{theme.newest_comments.limit}&order=-createdAt`,settings)
+        .then(response => response.json())
+        .then(data => {
+          const valineArray = data.results.map(function (e) {
+            return {
+              'avatar': e.QQAvatar,
+              'content': changeContent(e.comment),
+              'mail': e.mail,
+              'nick': e.nick,
+              'url': e.url,
+              'date': e.createdAt,
+            }
          })
-        })
-        
-        saveToLocal.set('leancloud-newest-comments', JSON.stringify(valineArray), 10/(60*24))
-        generateHtml(valineArray)
-
-      }).fail(()=>{
-        const $dom = document.querySelector('#card-newest-comments .aside-list')
-        $dom.innerHTML= "!{_p('aside.card_newest_comments.error')}"
-      })
+          saveToLocal.set('leancloud-newest-comments', JSON.stringify(valineArray), 10/(60*24))
+          generateHtml(valineArray)
+        }).catch(e => { 
+          const $dom = document.querySelector('#card-newest-comments .aside-list')
+          $dom.innerHTML= "!{_p('aside.card_newest_comments.error')}"
+        }) 
    }

    const newestCommentInit = () => {
--- a/layout/includes/third-party/pangu.pug
+++ b/layout/includes/third-party/pangu.pug
@@ -2,9 +2,10 @@ script.
  function panguFn () {
    if (typeof pangu === 'object') pangu.spacingElementById('content-inner')
    else {
-      $.getScript('!{url_for(theme.CDN.pangu)}', () => {
-        pangu.spacingElementById('content-inner')
-      })
+      getScript('!{url_for(theme.CDN.pangu)}')
+        .then(() => {
+          pangu.spacingElementById('content-inner')
+        })
    }
  }

@@ -16,4 +17,4 @@ script.
    }
  }

-  document.addEventListener('DOMContentLoaded', panguFn)
+  document.addEventListener('DOMContentLoaded', panguInit)
--- a/layout/includes/third-party/pjax.pug
+++ b/layout/includes/third-party/pjax.pug
@@ -29,8 +29,12 @@ script.
  document.addEventListener('pjax:complete', function () {
    window.refreshFn()

-    $('script[data-pjax]').each(function () {
-      $(this).parent().append($(this).remove())
+    document.querySelectorAll('script[data-pjax]').forEach(item => {
+      const newScript = document.createElement('script')
+      const content = item.text || item.textContent || item.innerHTML || ""
+      Array.from(item.attributes).forEach(attr => newScript.setAttribute(attr.name, attr.value))
+      newScript.appendChild(document.createTextNode(content))
+      item.parentNode.replaceChild(newScript, item)
    })

    GLOBAL_CONFIG.islazyload && window.lazyLoadInstance.update()
@@ -69,10 +73,8 @@ script.

    typeof typed === 'object' && typed.destroy()

-    $(window).off('scroll')
-
    //reset readmode
-    $('body').hasClass('read-mode') && $('body').removeClass('read-mode')
+    const $bodyClassList = document.body.classList
+    $bodyClassList.contains('read-mode') && $bodyClassList.remove('read-mode')

  })
-
--- a/layout/includes/third-party/search/local-search.pug
+++ b/layout/includes/third-party/search/local-search.pug
@@ -7,18 +7,6 @@
          input(placeholder=_p("local_search.input_placeholder") type="text").local-search-box--input
    hr
    #local-search-results
-      #local-hits
-      #local-stats
-        #hr.local-search-stats__hr
-          case config.language
-            when "zh-CN"
-              span=_p("local_search.by")
-              |  #[a(href="https://github.com/wzpan/hexo-generator-search" style={'color': '#49B1F5'}) hexo-generator-search]
-              |  #[span=_p("local_search.powered")]
-            when "en"
-            default
-              span=_p("local_search.powered_by")
-              |  #[a(href="https://github.com/wzpan/hexo-generator-search" style={'color': '#49B1F5'}) hexo-generator-search]
    span.search-close-button
      i.fas.fa-times
  #search-mask
--- a/layout/includes/third-party/subtitle.pug
+++ b/layout/includes/third-party/subtitle.pug
@@ -1,28 +1,34 @@
- var source = theme.subtitle.source
+- let source = theme.subtitle.source
+
 case source
  when 1
    script.
      function subtitleType () {
-        $.getJSON('https://api.btstu.cn/yan/api.php?charset=utf-8&encode=json',function (data) {
-          if (!{theme.subtitle.effect}) {
-            var sub = "!{theme.subtitle.sub}".length == 0 ? new Array() : "!{theme.subtitle.sub}".split(',')
-            var both = sub.unshift(data.text)
-            typed = new Typed('#subtitle', {
-              strings: sub,
-              startDelay: 300,
-              typeSpeed: 150,
-              loop: !{theme.subtitle.loop},
-              backSpeed: 50,
-            })
-          } else {
-            document.getElementById('subtitle').innerHTML = data.text
-          }
-        })
+        fetch('https://api.btstu.cn/yan/api.php?charset=utf-8&encode=json')
+          .then(response => response.json())
+          .then(data => {
+            if (!{theme.subtitle.effect}) {
+              var sub = "!{theme.subtitle.sub}".length == 0 ? new Array() : "!{theme.subtitle.sub}".split(',')
+              var both = sub.unshift(data.text)
+              typed = new Typed('#subtitle', {
+                strings: sub,
+                startDelay: 300,
+                typeSpeed: 150,
+                loop: !{theme.subtitle.loop},
+                backSpeed: 50,
+              })
+            } else {
+              document.getElementById('subtitle').innerHTML = data.text
+            }
+          })
      }

      if (!{theme.subtitle.effect}) {
-        if (typeof Typed === 'function') subtitleType()
-        else $.getScript('!{url_for(theme.CDN.typed)}', subtitleType)
+        if (typeof Typed === 'function') {
+          subtitleType()
+        } else {
+          getScript('!{url_for(theme.CDN.typed)}').then(subtitleType)
+        }
      } else {
        subtitleType()
      }
@@ -30,27 +36,32 @@ case source
  when 2
    script.
      function subtitleType () {
-        $.getJSON('https://v1.hitokoto.cn', function (data) {
-          if (!{theme.subtitle.effect}) {
-            var from = '出自 ' + data.from
-            var sub = "!{theme.subtitle.sub}".length == 0 ? new Array() : "!{theme.subtitle.sub}".split(',')
-            var both = sub.unshift(data.hitokoto, from)
-            var typed = new Typed('#subtitle', {
-              strings: sub,
-              startDelay: 300,
-              typeSpeed: 150,
-              loop: !{theme.subtitle.loop},
-              backSpeed: 50,
-            })
-          } else {
-            document.getElementById('subtitle').innerHTML = data.hitokoto
-          }
-        })
+        fetch('https://v1.hitokoto.cn')
+          .then(response => response.json())
+          .then(data => {
+            if (!{theme.subtitle.effect}) {
+              var from = '出自 ' + data.from
+              var sub = "!{theme.subtitle.sub}".length == 0 ? new Array() : "!{theme.subtitle.sub}".split(',')
+              var both = sub.unshift(data.hitokoto, from)
+              var typed = new Typed('#subtitle', {
+                strings: sub,
+                startDelay: 300,
+                typeSpeed: 150,
+                loop: !{theme.subtitle.loop},
+                backSpeed: 50,
+              })
+            } else {
+              document.getElementById('subtitle').innerHTML = data.hitokoto
+            }
+          })
      }

      if (!{theme.subtitle.effect}) {
-        if (typeof Typed === 'function') subtitleType()
-        else $.getScript('!{url_for(theme.CDN.typed)}', subtitleType)
+        if (typeof Typed === 'function') {
+          subtitleType()
+        } else {
+          getScript('!{url_for(theme.CDN.typed)}').then(subtitleType)
+        }
      } else {
        subtitleType()
      }
@@ -58,7 +69,7 @@ case source
  when 3
    script.
      function subtitleType () {
-        $.getScript('http://yijuzhan.com/api/word.php?m=js', function () {
+        getScript('http://yijuzhan.com/api/word.php?m=js').then(() => {
          var con = str[0]
          if (!{theme.subtitle.effect}) {
            var from = '出自 ' + str[1]
@@ -78,8 +89,11 @@ case source
      }

      if (!{theme.subtitle.effect}) {
-        if (typeof Typed === 'function') subtitleType()
-        else $.getScript('!{url_for(theme.CDN.typed)}', subtitleType)
+        if (typeof Typed === 'function') {
+          subtitleType()
+        } else {
+          getScript('!{url_for(theme.CDN.typed)}').then(subtitleType)
+        }
      } else {
        subtitleType()
      }
@@ -87,7 +101,7 @@ case source
  when 4
    script.
      function subtitleType () {
-        $.getScript('https://sdk.jinrishici.com/v2/browser/jinrishici.js',function () {
+        getScript('https://sdk.jinrishici.com/v2/browser/jinrishici.js').then(() => {
          jinrishici.load(function (result) {
            if (!{theme.subtitle.effect}) {
              var sub = "!{theme.subtitle.sub}".length == 0 ? new Array() : "!{theme.subtitle.sub}".split(',')
@@ -108,8 +122,11 @@ case source
      }

      if (!{theme.subtitle.effect}) {
-        if (typeof Typed === 'function') subtitleType()
-        else $.getScript('!{url_for(theme.CDN.typed)}', subtitleType)
+        if (typeof Typed === 'function') {
+          subtitleType()
+        } else {
+          getScript('!{url_for(theme.CDN.typed)}').then(subtitleType)
+        }
      } else {
        subtitleType()
      }
@@ -131,8 +148,11 @@ case source
      }

      if (!{theme.subtitle.effect}) {
-        if (typeof Typed === 'function') subtitleType()
-        else $.getScript('!{url_for(theme.CDN.typed)}', subtitleType)
+        if (typeof Typed === 'function') {
+          subtitleType()
+        } else {
+          getScript('!{url_for(theme.CDN.typed)}').then(subtitleType)
+        }
      } else {
        subtitleType()
-      }
+      }
--- a/layout/includes/widget/card_ad.pug
+++ b/layout/includes/widget/card_ad.pug
@@ -1,2 +1,3 @@
-.card-widget.card-ad
-  != theme.ad.aside
+if theme.ad && theme.ad.aside
+  .card-widget.ads-wrap
+    != theme.ad.aside
--- a/layout/includes/widget/card_announcement.pug
+++ b/layout/includes/widget/card_announcement.pug
@@ -1,6 +1,7 @@
-.card-widget.card-announcement
-  .card-content
-    .item-headline
-      i.fas.fa-bullhorn.card-announcement-animation
-      span= _p('aside.card_announcement')
-    .announcement_content!= theme.aside.card_announcement.content
+if theme.aside.card_announcement.enable
+  .card-widget.card-announcement
+    .card-content
+      .item-headline
+        i.fas.fa-bullhorn.card-announcement-animation
+        span= _p('aside.card_announcement')
+      .announcement_content!= theme.aside.card_announcement.content
--- a/layout/includes/widget/card_archives.pug
+++ b/layout/includes/widget/card_archives.pug
@@ -1,11 +1,12 @@
-.card-widget.card-archives
-  .card-content
-    .item-headline
-      i.fas.fa-archive
-      span= _p('aside.card_archives')
-    
-    - let type = theme.aside.card_archives.type || 'monthly'
-    - let format = theme.aside.card_archives.format || 'MMMM YYYY'
-    - let order = theme.aside.card_archives.order || -1
-    - let limit = theme.aside.card_archives.limit === 0 ? 0 : theme.aside.card_archives.limit || 8
-    != aside_archives({ type:type, format: format, order: order, limit: limit })
+if theme.aside.card_archives.enable
+  .card-widget.card-archives
+    .card-content
+      .item-headline
+        i.fas.fa-archive
+        span= _p('aside.card_archives')
+      
+      - let type = theme.aside.card_archives.type || 'monthly'
+      - let format = theme.aside.card_archives.format || 'MMMM YYYY'
+      - let order = theme.aside.card_archives.order || -1
+      - let limit = theme.aside.card_archives.limit === 0 ? 0 : theme.aside.card_archives.limit || 8
+      != aside_archives({ type:type, format: format, order: order, limit: limit })
--- a/layout/includes/widget/card_author.pug
+++ b/layout/includes/widget/card_author.pug
@@ -1,36 +1,37 @@
-.card-widget.card-info
-  .card-content
-    .card-info-avatar.is-center
-      if theme.lazyload.enable
-        img.avatar-img(data-lazy-src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
-      else
-        img.avatar-img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")      
-      .author-info__name= config.author
-      .author-info__description!= theme.aside.card_author.description || config.description
+if theme.aside.card_author.enable
+  .card-widget.card-info
+    .card-content
+      .card-info-avatar.is-center
+        if theme.lazyload.enable
+          img.avatar-img(data-lazy-src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
+        else
+          img.avatar-img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")      
+        .author-info__name= config.author
+        .author-info__description!= theme.aside.card_author.description || config.description

-    .card-info-data
-      if site.posts.length
-        .card-info-data-item.is-center
-          a(href=url_for(config.archive_dir) + '/')
-            .headline= _p('aside.articles') 
-            .length-num= site.posts.length
+      .card-info-data
+        if site.posts.length
+          .card-info-data-item.is-center
+            a(href=url_for(config.archive_dir) + '/')
+              .headline= _p('aside.articles') 
+              .length-num= site.posts.length

-      if site.tags.length
-        .card-info-data-item.is-center
-          a(href=url_for(config.tag_dir) + '/')
-            .headline= _p('aside.tags')
-            .length-num= site.tags.length
+        if site.tags.length
+          .card-info-data-item.is-center
+            a(href=url_for(config.tag_dir) + '/')
+              .headline= _p('aside.tags')
+              .length-num= site.tags.length

-      if site.categories.length
-        .card-info-data-item.is-center
-          a(href=url_for(config.category_dir) + '/')
-            .headline= _p('aside.categories') 
-            .length-num= site.categories.length
+        if site.categories.length
+          .card-info-data-item.is-center
+            a(href=url_for(config.category_dir) + '/')
+              .headline= _p('aside.categories') 
+              .length-num= site.categories.length

-    a#card-info-btn.button--animated(href=theme.aside.card_author.button.link)
-      i(class=theme.aside.card_author.button.icon)
-      span=theme.aside.card_author.button.text
-  
-    if(theme.social)
-        .card-info-social-icons.is-center
-          !=fragment_cache('social', function(){return partial('includes/header/social')}) 
+      a#card-info-btn.button--animated(href=theme.aside.card_author.button.link)
+        i(class=theme.aside.card_author.button.icon)
+        span=theme.aside.card_author.button.text
+    
+      if(theme.social)
+          .card-info-social-icons.is-center
+            !=fragment_cache('social', function(){return partial('includes/header/social')}) 
--- a/layout/includes/widget/card_categories.pug
+++ b/layout/includes/widget/card_categories.pug
@@ -1,9 +1,8 @@
-if site.categories.length
-  .card-widget.card-categories
-      .card-content
-        .item-headline
-          i.fas.fa-folder-open
-          span= _p('aside.card_categories')
-        !=aside_categories({ limit: theme.aside.card_categories.limit === 0 ? 0 : theme.aside.card_categories.limit || 8 , expand: theme.aside.card_categories.expand })
-
-  
+if theme.aside.card_categories.enable
+  if site.categories.length
+    .card-widget.card-categories
+        .card-content
+          .item-headline
+            i.fas.fa-folder-open
+            span= _p('aside.card_categories')
+          !=aside_categories({ limit: theme.aside.card_categories.limit === 0 ? 0 : theme.aside.card_categories.limit || 8 , expand: theme.aside.card_categories.expand })
--- a/layout/includes/widget/card_newest_comment.pug
+++ b/layout/includes/widget/card_newest_comment.pug
@@ -1,7 +1,8 @@
-.card-widget#card-newest-comments
-  .card-content
-    .item-headline
-      i.fas.fa-bolt
-      span= _p('aside.card_newest_comments.headline')
-    .aside-list
-      span= _p('aside.card_newest_comments.loading_text')
+if theme.newest_comments.enable
+  .card-widget#card-newest-comments
+    .card-content
+      .item-headline
+        i.fas.fa-bolt
+        span= _p('aside.card_newest_comments.headline')
+      .aside-list
+        span= _p('aside.card_newest_comments.loading_text')
--- a/layout/includes/widget/card_recent_post.pug
+++ b/layout/includes/widget/card_recent_post.pug
@@ -1,27 +1,28 @@
-.card-widget.card-recent-post
-  .card-content
-    .item-headline
-      i.fas.fa-history
-      span= _p('aside.card_recent_post')
-    .aside-list
-      - let postLimit = theme.aside.card_recent_post.limit === 0 ? site.posts.length : theme.aside.card_recent_post.limit || 5
-      - let sort = theme.aside.card_recent_post.sort === 'updated' ? 'updated' : 'date'
-      - site.posts.sort(sort, -1).limit(postLimit).each(function(article){
-        - let link = article.link || article.path
-        - let title = article.title || _p('no_title')
-        - let no_cover = article.cover === false || !theme.cover.aside_enable ? 'no-cover' : ''
-        - let post_cover = article.cover
-        .aside-list-item(class=no_cover)
-          if post_cover && theme.cover.aside_enable
-            a.thumbnail(href=url_for(link) title=title)
-              if theme.lazyload.enable
-                img(data-lazy-src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
+if theme.aside.card_recent_post.enable
+  .card-widget.card-recent-post
+    .card-content
+      .item-headline
+        i.fas.fa-history
+        span= _p('aside.card_recent_post')
+      .aside-list
+        - let postLimit = theme.aside.card_recent_post.limit === 0 ? site.posts.length : theme.aside.card_recent_post.limit || 5
+        - let sort = theme.aside.card_recent_post.sort === 'updated' ? 'updated' : 'date'
+        - site.posts.sort(sort, -1).limit(postLimit).each(function(article){
+          - let link = article.link || article.path
+          - let title = article.title || _p('no_title')
+          - let no_cover = article.cover === false || !theme.cover.aside_enable ? 'no-cover' : ''
+          - let post_cover = article.cover
+          .aside-list-item(class=no_cover)
+            if post_cover && theme.cover.aside_enable
+              a.thumbnail(href=url_for(link) title=title)
+                if theme.lazyload.enable
+                  img(data-lazy-src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
+                else
+                  img(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
+            .content
+              a.title(href=url_for(link) title=title)= title
+              if theme.aside.card_recent_post.sort === 'updated'
+                time(datetime=date_xml(article.updated) title=_p('post.updated') + ' ' + full_date(article.updated)) #[=date(article.updated, config.date_format)]
              else
-                img(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
-          .content
-            a.title(href=url_for(link) title=title)= title
-            if theme.aside.card_recent_post.sort === 'updated'
-              time(datetime=date_xml(article.updated) title=_p('post.updated') + ' ' + full_date(article.updated)) #[=date(article.updated, config.date_format)]
-            else
-              time(datetime=date_xml(article.date) title=_p('post.created') + ' ' + full_date(article.date)) #[=date(article.date, config.date_format)]
-      - })
+                time(datetime=date_xml(article.date) title=_p('post.created') + ' ' + full_date(article.date)) #[=date(article.date, config.date_format)]
+        - })
--- a/layout/includes/widget/card_tags.pug
+++ b/layout/includes/widget/card_tags.pug
@@ -1,12 +1,13 @@
-if site.tags.length
-  .card-widget.card-tags
-    .card-content
-      .item-headline
-        i.fas.fa-tags
-        span= _p('aside.card_tags')
+if theme.aside.card_tags.enable
+  if site.tags.length
+    .card-widget.card-tags
+      .card-content
+        .item-headline
+          i.fas.fa-tags
+          span= _p('aside.card_tags')

-      - let tagLimit = theme.aside.card_tags.limit === 0 ? 0 : theme.aside.card_tags.limit || 40
-      if theme.aside.card_tags.color
-        .card-tag-cloud!= cloudTags({source: site.tags, minfontsize: 1.1, maxfontsize: 1.5, limit: tagLimit, unit: 'em'})
-      else
-        .card-tag-cloud!= tagcloud({min_font: 1.1, max_font: 1.5, amount: tagLimit , color: true, start_color: '#999', end_color: '#99a9bf', unit: 'em'})
+        - let tagLimit = theme.aside.card_tags.limit === 0 ? 0 : theme.aside.card_tags.limit || 40
+        if theme.aside.card_tags.color
+          .card-tag-cloud!= cloudTags({source: site.tags, minfontsize: 1.1, maxfontsize: 1.5, limit: tagLimit, unit: 'em'})
+        else
+          .card-tag-cloud!= tagcloud({min_font: 1.1, max_font: 1.5, amount: tagLimit , color: true, start_color: '#999', end_color: '#99a9bf', unit: 'em'})
--- a/layout/includes/widget/card_webinfo.pug
+++ b/layout/includes/widget/card_webinfo.pug
@@ -1,31 +1,32 @@
-.card-widget.card-webinfo
-  .card-content
-    .item-headline
-      i.fas.fa-chart-line
-      span= _p('aside.card_webinfo.headline')
-    .webinfo
-      if theme.aside.card_webinfo.post_count
-        .webinfo-item
-          .item-name= _p('aside.card_webinfo.article_name') + " :"
-          .item-count= site.posts.length
-      if theme.runtimeshow.enable
-        .webinfo-item
-          .item-name= _p('aside.card_webinfo.runtime.name') + " :"
-          .item-count#runtimeshow(data-publishDate=date_xml(theme.runtimeshow.publish_date))
-      if theme.wordcount.enable && theme.wordcount.total_wordcount
-        .webinfo-item
-          .item-name=_p('aside.card_webinfo.site_wordcount') + " :"
-          .item-count=totalcount(site)
-      if theme.busuanzi.site_uv 
-        .webinfo-item
-          .item-name= _p('aside.card_webinfo.site_uv_name') + " :"
-          .item-count#busuanzi_value_site_uv
-      if theme.busuanzi.site_pv
-        .webinfo-item
-          .item-name= _p('aside.card_webinfo.site_pv_name') + " :"
-          .item-count#busuanzi_value_site_pv
-      if theme.aside.card_webinfo.last_push_date
-        .webinfo-item
-          .item-name= _p('aside.card_webinfo.last_push_date.name') + " :"
-          .item-count#last-push-date(data-lastPushDate=date_xml(Date.now()))
+if theme.aside.card_webinfo.enable
+  .card-widget.card-webinfo
+    .card-content
+      .item-headline
+        i.fas.fa-chart-line
+        span= _p('aside.card_webinfo.headline')
+      .webinfo
+        if theme.aside.card_webinfo.post_count
+          .webinfo-item
+            .item-name= _p('aside.card_webinfo.article_name') + " :"
+            .item-count= site.posts.length
+        if theme.runtimeshow.enable
+          .webinfo-item
+            .item-name= _p('aside.card_webinfo.runtime.name') + " :"
+            .item-count#runtimeshow(data-publishDate=date_xml(theme.runtimeshow.publish_date))
+        if theme.wordcount.enable && theme.wordcount.total_wordcount
+          .webinfo-item
+            .item-name=_p('aside.card_webinfo.site_wordcount') + " :"
+            .item-count=totalcount(site)
+        if theme.busuanzi.site_uv 
+          .webinfo-item
+            .item-name= _p('aside.card_webinfo.site_uv_name') + " :"
+            .item-count#busuanzi_value_site_uv
+        if theme.busuanzi.site_pv
+          .webinfo-item
+            .item-name= _p('aside.card_webinfo.site_pv_name') + " :"
+            .item-count#busuanzi_value_site_pv
+        if theme.aside.card_webinfo.last_push_date
+          .webinfo-item
+            .item-name= _p('aside.card_webinfo.last_push_date.name') + " :"
+            .item-count#last-push-date(data-lastPushDate=date_xml(Date.now()))

--- a/layout/includes/widget/index.pug
+++ b/layout/includes/widget/index.pug
@@ -1,28 +1,17 @@
 #aside_content.aside_content
-  if theme.aside.card_author.enable
-    !=partial('includes/widget/card_author', {}, {cache:theme.fragment_cache})
-  if theme.aside.card_announcement.enable
-    !=partial('includes/widget/card_announcement', {}, {cache:theme.fragment_cache})
+  !=partial('includes/widget/card_author', {}, {cache:theme.fragment_cache})
+  !=partial('includes/widget/card_announcement', {}, {cache:theme.fragment_cache})
  .sticky_layout
    if is_post()
      if showToc
        include ./card_post_toc.pug
-      if theme.aside.card_recent_post.enable
-        !=partial('includes/widget/card_recent_post', {}, {cache:theme.fragment_cache})
-      if theme.ad && theme.ad.aside
-        !=partial('includes/widget/card_ad', {}, {cache:theme.fragment_cache})
+      !=partial('includes/widget/card_recent_post', {}, {cache:theme.fragment_cache})
+      !=partial('includes/widget/card_ad', {}, {cache:theme.fragment_cache})
    else
-      if theme.aside.card_recent_post.enable
-        !=partial('includes/widget/card_recent_post', {}, {cache:theme.fragment_cache})
-      if theme.ad && theme.ad.aside
-        !=partial('includes/widget/card_ad', {}, {cache:theme.fragment_cache})
-      if theme.newest_comments.enable
-        !=partial('includes/widget/card_newest_comment', {}, {cache:theme.fragment_cache})
-      if theme.aside.card_categories.enable
-        !=partial('includes/widget/card_categories', {}, {cache:theme.fragment_cache})
-      if theme.aside.card_tags.enable
-        !=partial('includes/widget/card_tags', {}, {cache:theme.fragment_cache})
-      if theme.aside.card_archives.enable
-        !=partial('includes/widget/card_archives', {}, {cache:theme.fragment_cache})
-      if theme.aside.card_webinfo.enable
-        !=partial('includes/widget/card_webinfo', {}, {cache:theme.fragment_cache})
+      !=partial('includes/widget/card_recent_post', {}, {cache:theme.fragment_cache})
+      !=partial('includes/widget/card_ad', {}, {cache:theme.fragment_cache})
+      !=partial('includes/widget/card_newest_comment', {}, {cache:theme.fragment_cache})
+      !=partial('includes/widget/card_categories', {}, {cache:theme.fragment_cache})
+      !=partial('includes/widget/card_tags', {}, {cache:theme.fragment_cache})
+      !=partial('includes/widget/card_archives', {}, {cache:theme.fragment_cache})
+      !=partial('includes/widget/card_webinfo', {}, {cache:theme.fragment_cache})