1. Feature: the sidebar can auto scroll when the toc out of the screen

2. Fix: When the picture is loaded, the picture appears black frame

_config.yml

@@ -121,7 +121,6 @@ cdn:
   css:
     fontawesome: https://cdn.jsdelivr.net/npm/font-awesome@latest/css/font-awesome.min.css
     # fontawesomeV5: https://use.fontawesome.com/releases/v5.8.1/css/all.css
-    googlefont: https://fonts.googleapis.com/css?family=Titillium+Web
     fancybox: https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@latest/dist/jquery.fancybox.min.css
   js:
     jquery: https://cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js
@@ -241,7 +240,7 @@ valine:
   verify: false # valine verify code (true/false)
   pageSize: 10 # comment list page size
   avatar: monsterid # gravatar style https://valine.js.org/#/avatar
-  lang: en # i18n: zh-cn/en/tw
+  lang: en # i18n: zh-cn/en
   placeholder: Please leave your footprints # valine comment input placeholder(like: Please leave your footprints )
   guest_info: nick,mail,link #valine comment header inf
 
@@ -329,7 +328,7 @@ related_post:
 # canvas_ribbon
 # See: https://github.com/hustcc/ribbon.js
 canvas_ribbon:
-  enable: false
+  enable: true
   size: 150
   alpha: 0.6
   zIndex: -1
@@ -337,7 +336,7 @@ canvas_ribbon:
 
 
 canvas_ribbon_piao:
-  enable: true
+  enable: false
 
 
 # 避免重複網址分散seo
@@ -353,11 +352,18 @@ Open_Graph_meta: true
 readmode:
   enable: true
 
+#全局字體
 font:
   enable: false
   font-family: Lato, Helvetica Neue For Number, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB,"Microsoft JhengHei", "MicrMicrosoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif
   code-font: consolas, Menlo, "PingFang SC", "Microsoft JhengHei","Microsoft YaHei", monospace, Helvetica Neue For Number
 
+#網站名字字體
+#左上角網站名字 主頁居中網站名字
+blog_title_font:
+  #字體鏈接
+  font_link: https://fonts.googleapis.com/css?family=Titillium+Web
+  font-family: Titillium Web, PingFang SC, Hiragino Sans GB, "Microsoft JhengHei", "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif
 
 #水平分隔綫
 hr:
@@ -387,13 +393,13 @@ aside:
 translate:
   enable: true
   # 默認按鈕顯示文字
-  default: 簡
+  default: 繁
   #网站默认语言，1: 繁體中文, 2: 简体中文
-  defaultEncoding: 1
+  defaultEncoding: 2
   #延迟时间,若不在前, 要设定延迟翻译时间, 如100表示100ms,默认为0
   translateDelay: 0
   #博客网址
-  cookieDomain: "https://jerryc.me/"
+  cookieDomain: "https://xxx/"
   #當文字是簡體時，按鈕顯示的文字
   msgToTraditionalChinese: "繁"
   #當文字是繁體時，按鈕顯示的文字
@@ -407,3 +413,8 @@ fireworks:
 #百度推送
 baidu_push:
   enable: false
+
+#https://instant.page/
+#prefetch預加載
+instantpage:
+  enable: true

languages/default.yml

@@ -51,7 +51,6 @@ pagination:
   next: Next Post
 
 comment: Comment
-relatedPosts_headline: Recommend
 
 aside:
   articles: Articles

languages/en.yml

@@ -51,7 +51,6 @@ pagination:
   next: Next Post
 
 comment: Comment
-relatedPosts_headline: Recommend
 
 aside:
   articles: Articles

languages/zh-CN.yml

@@ -52,7 +52,6 @@ pagination:
   next: 下一篇
 
 comment: 评论
-relatedPosts_headline: 相关推荐
 
 aside:
   articles: 文章

languages/zh-TW.yml

@@ -53,7 +53,6 @@ pagination:
   next: 下一篇
 
 comment: 評論
-relatedPosts_headline: 相關推薦
 
 aside:
   articles: 文章

layout/flink.pug

@@ -6,7 +6,7 @@
         each item in i.link_list
           li.md-links-item
             a(href=item.link  title=item.name target="_blank")
-              img.lozad(data-src=item.avatar alt=item.name onerror=`onerror=null;src='${theme.lodding_bg.flink}'` height="72px")
+              img.lozad(data-src=item.avatar onerror=`onerror=null;src='${theme.lodding_bg.flink}'` height="72px")
               div(class="md-links-title")= item.name 
                 <br/>
               div(class="md-links-des")=item.descr

layout/includes/additional-js.pug

@@ -88,4 +88,5 @@ if is_home()
 if theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv
   script(async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js")
 
+if theme.instantpage.enable
   script(src="https://cdn.jsdelivr.net/npm/instant.page@1.2.2/instantpage.min.js" type="module")

layout/includes/comments/index.pug

@@ -3,7 +3,6 @@ if theme.disqus.enable
   #post-comment
     .comment_headling
       i.fa.fa-comments.fa-fw(aria-hidden="true")
-      =" "
       span= _p('comment')
     include ./disqus.pug
 else if theme.laibili && theme.laibili.enable
@@ -11,7 +10,6 @@ else if theme.laibili && theme.laibili.enable
   #post-comment
     .comment_headling
       i.fa.fa-comments.fa-fw(aria-hidden="true")
-      =" "
       span= _p('comment')
     include ./laibili.pug
 else if theme.gitment && theme.gitment.enable
@@ -19,7 +17,6 @@ else if theme.gitment && theme.gitment.enable
   #post-comment
     .comment_headling
       i.fa.fa-comments.fa-fw(aria-hidden="true")
-      =" "
       span= _p('comment')
     include ./gitment.pug
 else if theme.gitalk && theme.gitalk.enable
@@ -27,7 +24,6 @@ else if theme.gitalk && theme.gitalk.enable
   #post-comment
     .comment_headling
       i.fa.fa-comments.fa-fw(aria-hidden="true")
-      =" "
       span= _p('comment')
     include ./gitalk.pug
 else if theme.valine && theme.valine.enable
@@ -35,6 +31,5 @@ else if theme.valine && theme.valine.enable
   #post-comment
     .comment_headling
       i.fa.fa-comments.fa-fw(aria-hidden="true")
-      =" "
       span= _p('comment')
     include ./valine.pug

layout/includes/head.pug

@@ -113,3 +113,6 @@ if (is_archive() && preload_archive_img)
   link(rel="preload" href=url_for(preload_archive_img)  as="image" )
 else if (!is_post() && preload_img)
   link(rel="preload" href=url_for(preload_img)  as="image" )
+
+if theme.blog_title_font.font_link
+  link(rel='stylesheet', href=url_for(theme.blog_title_font.font_link))

layout/includes/layout.pug

@@ -7,12 +7,15 @@
 - if (is_year()) pageTitle += ': ' + page.year
 - var pageTitle_saved  //- 暫時存儲pageTitle
 - var pageTitle_no_include_blog_name //- 存儲pageTitle， 不帶 " | "，meta用
+- var home_subtitle_true //有subtitle
 //- home時顯示config.title (JerryC)，其他顯示 pageTitle。meta用
 - is_home() ? pageTitle_no_include_blog_name = config.title : pageTitle_no_include_blog_name = pageTitle
 //- 暫時存儲pageTitle
 - pageTitle ? pageTitle_saved = pageTitle + ' | ' + config.title : pageTitle_saved = config.title
+//- 是否有 config.subtitle 是各自显示
+- config.subtitle ? home_subtitle_true = ' - ' + config.subtitle : home_subtitle_true = ''
 //- home時pageTitle顯示 JerryC - subtitle，其他顯示 pageTitle | JerryC
-- is_home() ? pageTitle = config.title + ' - ' + config.subtitle : pageTitle = pageTitle_saved
+- is_home() ? pageTitle = config.title + home_subtitle_true : pageTitle = pageTitle_saved
 
 - var pageDescription = page.description || page.title || config.description || ''
 - var pageKeywords = (config.keywords || []).join(',')

layout/includes/pagination.pug

@@ -14,21 +14,19 @@ else
     if(page.prev)
       if(page.next)
         .prev-post.pull-left
-          - var pagination_cover = page.prev.cover || theme.default_cover
+          - var pagination_cover = page.prev.cover || random_cover()
           a(href=url_for(page.prev.path))
             img.prev_cover.lozad(data-src=`${pagination_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'` )
             .label=_p('pagination.prev')
             .prev_info
-              //- i.fa.fa-chevron-left   
               span=page.prev.title
       else
         .prev-post.pull-full
-          - var pagination_cover = page.prev.cover || theme.default_cover
+          - var pagination_cover = page.prev.cover || random_cover()
           a(href=url_for(page.prev.path))
             img.prev_cover.lozad(data-src=`${pagination_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'`)
             .label=_p('pagination.prev')
             .prev_info
-              //- i.fa.fa-chevron-left   
               span=page.prev.title
 
           
@@ -36,21 +34,18 @@ else
     if(page.next)
       if(page.prev)
         .next-post.pull-right
-          - var pagination_cover = page.next.cover || theme.default_cover
+          - var pagination_cover = page.next.cover || random_cover()
           a(href=url_for(page.next.path))
             img.next_cover.lozad(data-src=`${pagination_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'`)
             .label=_p('pagination.next')
             .next_info
               span=page.next.title 
-              //- i.fa.fa-chevron-right
       else
         .next-post.pull-full
-          - var pagination_cover = page.next.cover || theme.default_cover
+          - var pagination_cover = page.next.cover || random_cover()
           a(href=url_for(page.next.path))
             img.next_cover.lozad(data-src=`${pagination_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'`)
             .label=_p('pagination.next')
             .next_info
               span=page.next.title      
-              //- i.fa.fa-chevron-right
-      
 

layout/includes/recent-posts.pug

@@ -3,22 +3,22 @@ each article , index in page.posts.data
     - var link = article.link || article.path
       if index%2 == 0
         .post_cover.is_left
-          a(href=url_for(link))
+          a(href=url_for(link) title=article.title || _p('no_title'))
             - var post_cover = article.cover
             - var default_post_cover = random_cover()
             if (post_cover)
-              img.post_bg.lozad(data-src=`${post_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'` title=article.title || _p('no_title'))
+              img.post_bg.lozad(data-src=`${post_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'`)
             else
-              img.post_bg.lozad(data-src=`${default_post_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'` title=article.title || _p('no_title'))
+              img.post_bg.lozad(data-src=`${default_post_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'`)
       else
         .post_cover.is_right
-          a(href=url_for(link))
+          a(href=url_for(link) title=article.title || _p('no_title'))
             - var post_cover = article.cover
             - var default_post_cover = random_cover()
             if (post_cover)
-              img.post_bg.lozad(data-src=`${post_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'` title=article.title || _p('no_title'))
+              img.post_bg.lozad(data-src=`${post_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'`)
             else
-              img.post_bg.lozad(data-src=`${default_post_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'` title=article.title || _p('no_title'))
+              img.post_bg.lozad(data-src=`${default_post_cover}` onerror=`onerror=null;src='${theme.lodding_bg.post_page}'`)
 
     .recent-post-info   
       a.article-title(href=url_for(link) title= article.title || _p('no_title'))= article.title || _p('no_title')

layout/includes/related-posts.pug

@@ -1,6 +0,0 @@
-.relatedPosts
-  .relatedPosts_headline
-    i.fa.fa-thumbs-up(aria-hidden="true")
-    span=' ' + _p('relatedPosts_headline')
-  .relatedPosts_list!= related_posts(page,site.posts)
-  .clear_both

layout/includes/widget/card_categories.pug

@@ -1,3 +1,4 @@
+if site.categories.length
   .card_widget.card-categories
       .card-content
         .item_headline

layout/includes/widget/card_tags.pug

@@ -1,3 +1,4 @@
+if site.tags.length
   .card_widget.card-tags
     .card-content
       .item_headline

layout/page.pug

@@ -6,7 +6,7 @@ block content
       .tag-cloud__title= _p('page.tag')
         |  - 
         span.tag-cloud__amount= site.tags.length
-      .tag-cloud-tags!= tagcloud({min_font: 20, max_font: 43, amount: 200, color: true, start_color: '#A4D8FA', end_color: '#0790E8'})
+      .tag-cloud-tags!= tags(site.tags)
       if page.comments !== false
         include includes/comments/index.pug
     #aside_content.aside_content

layout/post.pug

@@ -71,6 +71,6 @@ block content
   include includes/pagination.pug
   
   if theme.related_post && theme.related_post.enable
-    include includes/related-posts.pug
+    != related_posts(page,site.posts)
   if page.comments !== false
     include includes/comments/index.pug

scripts/related_post.js

@@ -23,16 +23,37 @@ hexo.extend.helper.register('related_posts', function(currentPost, allPosts){
   if (relatedPosts.length == 0) { return '' };
   var result = "";
   var limit_num = hexo.theme.config.related_post.limit || 6
+  var lang = hexo.theme.config.rootConfig.language;
+  var headline_lang;
+  if (lang === 'zh-CN') {
+    headline_lang = '相关推荐';
+  } else if ( lang === 'zh-TW') {
+    headline_lang = '相關推薦';
+  } else {
+    headline_lang = 'Recommend';
+  }
+    
   relatedPosts = relatedPosts.sort(compare('weight'));
+
+  if (relatedPosts.length > 0) {
+    result += '<div class="relatedPosts">'
+    result += '<div class="relatedPosts_headline"><i class="fa fa-fw fa-thumbs-up" aria-hidden="true"></i><span>' + headline_lang + '</span></div>'
+    result += '<div class="relatedPosts_list">'
+  
   for (var i = 0; i < Math.min(relatedPosts.length, limit_num); i++) {
  
     var cover = relatedPosts[i].cover || random_cover()
+
     result += '<div class="relatedPosts_item"><a href="' + hexo.theme.config.rootConfig.root + relatedPosts[i].path + '" title="' + relatedPosts[i].title + '">';
     result += '<img class="relatedPosts_cover lozad" data-src="' + cover + '">';
     result += '<div class="relatedPosts_title">' + relatedPosts[i].title + '</div>';
     result += '</a></div>'
     };
+    
+    result += '</div><div class="clear_both"></div></div>'
   return result;
+
+}
 });
 hexo.extend.helper.register('echo', function(path){
 return path;

scripts/tags.js

@@ -0,0 +1,16 @@
+hexo.extend.helper.register('tags', function (site_tags) {
+  var result = "";
+  site_tags.sort('path').each(function (tags) {    
+  var fontSize = Math.floor(Math.random() * 15 + 15) + "px"; //15 ~ 30
+  var color =
+    "rgb(" +
+    Math.floor(Math.random() * 201) +
+    ", " +
+    Math.floor(Math.random() * 201) +
+    ", " +
+    Math.floor(Math.random() * 201) +
+    ")"; // 0,0,0 -> 200,200,200
+    result += '<a href="' + hexo.theme.config.rootConfig.root + tags.path + '" style="font-size:' + fontSize + ';color:' + color + '">' + tags.name + '</a>'
+  })
+  return result;
+})

source/css/_global/index.styl

@@ -206,7 +206,7 @@ table
 #site-name,
 #aside_content .author-info__name,
 #aside_content .author-info__description
-  font-family: 'Titillium Web',Lato,PingFang SC, Hiragino Sans GB, "Microsoft JhengHei", "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif
+  font-family: $site-name-font
 
 
 
@@ -351,3 +351,8 @@ table
   position: fixed
   z-index: -1
   pointer-events: none
+
+
+// 去掉加載黑框
+img[src=""],img:not([src])
+  opacity: 0

source/css/var.styl

@@ -9,6 +9,7 @@ $theme-hr-color = #A4D8FA
 $theme-read-mode-bg-color = #FAF9DE
 $font-family= Lato, Helvetica Neue For Number, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif
 $code-font = consolas, Menlo, "PingFang SC", "Microsoft YaHei", monospace, Helvetica Neue For Number
+$site-name-font = "Titillium Web", Lato,PingFang SC, Hiragino Sans GB, "Microsoft JhengHei", "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif
 //hr icon
 $hr-icon = '\f0c4'
 $hr-icon-top = -10px
@@ -27,6 +28,10 @@ if hexo-config("font") && hexo-config("font.enable")
   $font-family = convert(hexo-config("font.font-family")) || 'Lato, Helvetica Neue For Number, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif'
   $code-font = convert(hexo-config("font.code-font")) || 'consolas, Menlo, "PingFang SC", "Microsoft YaHei", monospace, Helvetica Neue For Number'
 
+if hexo-config("blog_title_font.font-family")
+  $site-name-font = convert(hexo-config("blog_title_font.font-family")) || '"Titillium Web",Lato,PingFang SC, Hiragino Sans GB, "Microsoft JhengHei", "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif'
+
+
 if hexo-config("hr") && hexo-config("hr.enable")
   $hr-icon = hexo-config("hr.icon") || '\f0c4'
   $hr-icon-top = convert(hexo-config("hr.icon-top")) || -10px
@@ -38,6 +43,7 @@ $font-color = #1F2D3D
 $rem = 20px
 $font-family = $font-family
 $code-font = $code-font
+$site-name-font = $site-name-font
 $text-line-height = 2
 $sm = 768px
 $bg = 1024px

source/js/main.js

@@ -94,37 +94,6 @@ $(function () {
   });
 
 
-  //--------------------------------------------------------------------------------------------------------
-  // tags 隨機大小 顔色
-  var list = document.querySelectorAll(".tag-cloud .tag-cloud-tags a");
-
-  if ($(window).width() > 768) {
-    Array.prototype.forEach.call(list, (item, index) => {
-      item.style.fontSize = Math.floor(Math.random() * 20 + 15) + "px"; //15 ~ 35
-      item.style.color =
-        "rgb(" +
-        Math.floor(Math.random() * 201) +
-        ", " +
-        Math.floor(Math.random() * 201) +
-        ", " +
-        Math.floor(Math.random() * 201) +
-        ")"; // 0,0,0 -> 200,200,200
-    });
-  } else {
-    Array.prototype.forEach.call(list, (item, index) => {
-      item.style.fontSize = Math.floor(Math.random() * 13 + 15) + "px"; //15 ~ 28
-      item.style.color =
-        "rgb(" +
-        Math.floor(Math.random() * 201) +
-        ", " +
-        Math.floor(Math.random() * 201) +
-        ", " +
-        Math.floor(Math.random() * 201) +
-        ")"; // 0,0,0 -> 200,200,200
-    });
-  }
-
-
   //--------------------------------------------------------------------------------------------------------
   // bookmark
   $.fancyConfirm = function (opts) {
@@ -316,6 +285,7 @@ $(function () {
       $(".toggle-menu *").css({ 'background-color': '#3b3a3a', 'text-shadow': 'none' });
       $('body').addClass("is_hidden");
       $('.menus').addClass("menu_open");
+      fixbg_menu();
     } else {
       $(".toggle-menu").removeClass("close").addClass("open");
       $("#page-header #site-name,#page-header .search").css({ 'color': '', 'text-shadow': '' });
@@ -329,6 +299,7 @@ $(function () {
     }
   })
 
+  function fixbg_menu() {
     const fixScroll = (scrollEl) => {
       let startY
       scrollEl.addEventListener('touchstart', function (event) {
@@ -364,6 +335,8 @@ $(function () {
     }
     const scrollEl = document.querySelector(".menus");
     fixScroll(scrollEl)
+  }
+
   
 
   $(window).on('resize', function (e) {
@@ -546,6 +519,18 @@ $(function () {
         // Hide their respective list of subsections
         .find('.toc-child').hide()
     }
+
+    if ($('.toc-link').hasClass('active')){
+      var active_position = $(".active").offset().top;
+      var sidebar_scrolltop = $("#sidebar").scrollTop();
+      if (active_position > (top + $(window).height() - 50)) {             
+        $("#sidebar").scrollTop(sidebar_scrolltop + 100);
+      } else if (active_position < top + 50)
+      {
+        $("#sidebar").scrollTop(sidebar_scrolltop - 100);
+        }
+    }
+
   }
 
   //代碼框雙擊全屏