🎨 #12472

.gitignore

@@ -14,7 +14,7 @@
 
 src/main/webapp/skins/*
 !src/main/webapp/skins/mobile
-!src/main/webapp/skins/nijigen
+!src/main/webapp/skins/Medium
 
 src/main/webapp/markdowns/*
 !src/main/webapp/markdowns/README.md

src/main/webapp/WEB-INF/static-resources.xml

@@ -69,9 +69,6 @@
     <include path="/skins/**/*.svg"/>
     <include path="/skins/**/*.ttf"/>
     <include path="/skins/**/*.woff"/>
-    <include path="/skins/**/*.json"/>
-    <include path="/skins/**/*.moc"/>
-    <include path="/skins/**/*.mtn"/>
 
     <include path="/css/**.css"/>
     <include path="/css/**/*.css"/>
@@ -103,6 +100,9 @@
     <include path="/plugins/**/*.html"/>
     <include path="/plugins/**.htm"/>
     <include path="/plugins/**/*.htm"/>
+    <include path="/plugins/**/*.json"/>
+    <include path="/plugins/**/*.moc"/>
+    <include path="/plugins/**/*.mtn"/>
 
     <include path="/CHANGE_LOGS.html"/>
     <include path="/LICENSE.txt"/>

src/main/webapp/plugins/kanbanniang/assert/index.js

+String.prototype.render = function(context) {
+  var tokenReg = /(\\)?\{([^\{\}\\]+)(\\)?\}/g;
+
+  return this.replace(tokenReg, function(word, slash1, token, slash2) {
+    if (slash1 || slash2) {
+      return word.replace('\\', '');
+    }
+
+    var variables = token.replace(/\s/g, '').split('.');
+    var currentObject = context;
+    var i, length, variable;
+
+    for (i = 0, length = variables.length; i < length; ++i) {
+      variable = variables[i];
+      currentObject = currentObject[variable];
+      if (currentObject === undefined || currentObject === null) return '';
+    }
+    return currentObject;
+  });
+};
+
+var re = /x/;
+console.log(re);
+re.toString = function() {
+  showMessage('哈哈，你打开了控制台，是想要看看我的秘密吗？', 5000, true);
+  return '';
+};
+
+$(document).on('copy', function() {
+  showMessage('你都复制了些什么呀，转载要记得加上出处哦', 5000, true);
+});
+
+$('#hitokoto').mouseover(function() {
+  var text = '这句一言出处是 <span style="color:#0099cc;">『{source}』</span>，是 <span style="color:#0099cc;">{author}</span> 在 {date} 时投稿的！';
+  var hitokoto = JSON.parse($(this)[0].dataset.raw);
+  text = text.render(
+      {source: hitokoto.source, author: hitokoto.author, date: hitokoto.date});
+  showMessage(text, 3000);
+});
+
+$('.waifu-tool .fui-home').click(function() {
+  window.location = 'https://imjad.cn/';
+});
+
+$('.waifu-tool .fui-eye').click(function() {
+  switchNightMode();
+  showMessage('你会做眼保健操吗？', 3000, true);
+});
+
+$('.waifu-tool .fui-chat').click(function() {
+  showHitokoto();
+});
+
+$('.waifu-tool .fui-user').click(function() {
+  loadRandModel();
+  showMessage('我的新衣服好看嘛', 3000, true);
+});
+
+$('.waifu-tool .fui-info-circle').click(function() {
+  window.open(
+      'https://imjad.cn/archives/lab/add-dynamic-poster-girl-with-live2d-to-your-blog-02');
+});
+
+$('.waifu-tool .fui-cross').click(function() {
+  sessionStorage.setItem('waifu-dsiplay', 'none');
+  showMessage('愿你有一天能与重要的人重逢', 1300, true);
+  window.setTimeout(function() {$('.waifu').hide();}, 1300);
+});
+
+$('.waifu-tool .fui-photo').click(function() {
+  showMessage('照好了嘛，是不是很可爱呢？', 5000, true);
+  window.Live2D.captureName = 'Pio.png';
+  window.Live2D.captureFrame = true;
+});
+
+$.ajax({
+  cache: true,
+  url: latkeConfig.staticServePath + '/plugins/kanbanniang/assert/tips.json',
+  dataType: 'json',
+  success: function(result) {
+    $.each(result.mouseover, function(index, tips) {
+      $(document).on('mouseover', tips.selector, function() {
+        var text = tips.text;
+        if (Array.isArray(
+            tips.text)) text = tips.text[Math.floor(Math.random() *
+            tips.text.length + 1) - 1];
+        text = text.render({text: $(this).text()});
+        showMessage(text, 3000);
+      });
+    });
+    $.each(result.click, function(index, tips) {
+      $(document).on('click', tips.selector, function() {
+        var text = tips.text;
+        if (Array.isArray(
+            tips.text)) text = tips.text[Math.floor(Math.random() *
+            tips.text.length + 1) - 1];
+        text = text.render({text: $(this).text()});
+        showMessage(text, 3000, true);
+      });
+    });
+    $.each(result.seasons, function(index, tips) {
+      var now = new Date();
+      var after = tips.date.split('-')[0];
+      var before = tips.date.split('-')[1] || after;
+
+      if ((after.split('/')[0] <= now.getMonth() + 1 && now.getMonth() + 1 <=
+          before.split('/')[0]) &&
+          (after.split('/')[1] <= now.getDate() && now.getDate() <=
+              before.split('/')[1])) {
+        var text = tips.text;
+        if (Array.isArray(
+            tips.text)) text = tips.text[Math.floor(Math.random() *
+            tips.text.length + 1) - 1];
+        text = text.render({year: now.getFullYear()});
+        showMessage(text, 6000, true);
+      }
+    });
+  },
+});
+
+(function() {
+  var text;
+  var referrer = document.createElement('a');
+  if (document.referrer !== '') {
+    referrer.href = document.referrer;
+  }
+
+  if (referrer.href !== '' && referrer.hostname != 'imjad.cn') {
+    var referrer = document.createElement('a');
+    referrer.href = document.referrer;
+    text = 'Hello! 来自 <span style="color:#0099cc;">' + referrer.hostname +
+        '</span> 的朋友';
+    var domain = referrer.hostname.split('.')[1];
+    if (domain == 'baidu') {
+      text = 'Hello! 来自 百度搜索 的朋友<br>你是搜索 <span style="color:#0099cc;">' +
+          referrer.search.split('&wd=')[1].split('&')[0] + '</span> 找到的我吗？';
+    } else if (domain == 'so') {
+      text = 'Hello! 来自 360搜索 的朋友<br>你是搜索 <span style="color:#0099cc;">' +
+          referrer.search.split('&q=')[1].split('&')[0] + '</span> 找到的我吗？';
+    } else if (domain == 'google') {
+      text = 'Hello! 来自 谷歌搜索 的朋友<br>欢迎阅读<span style="color:#0099cc;">『' +
+          document.title.split(' - ')[0] + '』</span>';
+    }
+  } else {
+    if (window.location.href == 'https://imjad.cn/') { //如果是主页
+      var now = (new Date()).getHours();
+      if (now > 23 || now <= 5) {
+        text = '你是夜猫子呀？这么晚还不睡觉，明天起的来嘛';
+      } else if (now > 5 && now <= 7) {
+        text = '早上好！一日之计在于晨，美好的一天就要开始了';
+      } else if (now > 7 && now <= 11) {
+        text = '上午好！工作顺利嘛，不要久坐，多起来走动走动哦！';
+      } else if (now > 11 && now <= 14) {
+        text = '中午了，工作了一个上午，现在是午餐时间！';
+      } else if (now > 14 && now <= 17) {
+        text = '午后很容易犯困呢，今天的运动目标完成了吗？';
+      } else if (now > 17 && now <= 19) {
+        text = '傍晚了！窗外夕阳的景色很美丽呢，最美不过夕阳红~';
+      } else if (now > 19 && now <= 21) {
+        text = '晚上好，今天过得怎么样？';
+      } else if (now > 21 && now <= 23) {
+        text = '已经这么晚了呀，早点休息吧，晚安~';
+      } else {
+        text = '嗨~ 快来逗我玩吧！';
+      }
+    } else {
+      $.getJSON('https://api.imjad.cn/interface/lastactivity/',
+          function(result) {
+            var now = result.now;
+            var lastActivity = result.ts;
+            var idle = now - lastActivity;
+
+            if (idle >= 60 * 60 * 24 * 30) {
+              text = '我家主人已经出门一个月了，可是到现在也没回来，不会是出什么事了吧，好担心啊';
+            } else if (idle >= 60 * 60 * 24 * 7) {
+              text = '我家主人已经出门一周了，到现在还没回来，你知道他去哪里了吗？';
+            } else if (idle >= 60 * 30) {
+              text = '我家主人' + formatSeconds(idle) +
+                  '前来过，先看看<span style="color:#0099cc;">『' +
+                  document.title.split(' - ')[0] + '』</span>吧，有想法可以在评论里留言哦~';
+            } else if (idle >= 60 * 2) {
+              text = '真是不巧，我家主人刚才还在，先看看<span style="color:#0099cc;">『' +
+                  document.title.split(' - ')[0] + '』</span>吧，有想法可以在评论里留言哦~';
+            } else {
+              text = '太巧了！我家主人正好在家，对<span style="color:#0099cc;">『' +
+                  document.title.split(' - ')[0] +
+                  '』</span>有什么想法吗？在评论里留言吧，相信很快就会有回复的说~';
+            }
+            showMessage(text, 10000);
+          });
+    }
+  }
+  showMessage(text, 6000);
+})();
+
+window.hitokotoTimer = window.setInterval(showHitokoto, 30000);
+
+function showHitokoto() {
+  $.getJSON(
+      'https://api.imjad.cn/hitokoto/?cat=&charset=utf-8&length=55&encode=json',
+      function(result) {
+        showMessage(result.hitokoto, 5000);
+      });
+}
+
+function showMessage(text, timeout, flag) {
+  if (flag || sessionStorage.getItem('waifu-text') === '' ||
+      sessionStorage.getItem('waifu-text') === null) {
+    if (Array.isArray(text)) text = text[Math.floor(Math.random() *
+        text.length + 1) - 1];
+    //console.log(text);
+
+    if (flag) sessionStorage.setItem('waifu-text', text);
+
+    $('.waifu-tips').stop();
+    $('.waifu-tips').html(text).fadeTo(200, 1);
+    if (timeout === null) timeout = 5000;
+    hideMessage(timeout);
+  }
+}
+
+function hideMessage(timeout) {
+  $('.waifu-tips').stop().css('opacity', 1);
+  if (timeout === null) timeout = 5000;
+  window.setTimeout(function() {sessionStorage.removeItem('waifu-text');},
+      timeout);
+  $('.waifu-tips').delay(timeout).fadeTo(200, 0);
+}
+
+function loadRandModel() {
+  var modelJSON = '/usr/themes/Moricolor/assets/live2d/potionmaker/rand.php?v=0.0.1&_=' +
+      Date.now();
+  localStorage.setItem('modelJSON', modelJSON);
+
+  loadlive2d('live2d', modelJSON, console.log('live2d', '模型加载完成'));
+}
+
+function formatSeconds(value) {
+  var seconds = parseInt(value);// 秒
+  var minutes = 0;
+  var hours = 0;
+  var days = 0;
+  if (seconds > 60) {
+    minutes = parseInt(seconds / 60);
+    seconds = parseInt(seconds % 60);
+    if (minutes > 60) {
+      hours = parseInt(minutes / 60);
+      minutes = parseInt(minutes % 60);
+      if (hours > 24) {
+        days = parseInt(hours / 24);
+        hours = parseInt(hours % 24);
+      }
+    }
+  }
+  var result = '';
+  if (minutes > 0)
+    result = '' + parseInt(minutes) + '分';
+  if (hours > 0 && hours <= 24)
+    result = '' + parseInt(hours) + '小时' + result;
+  if (days > 0)
+    result = '' + parseInt(days) + '天' + result;
+  return result;
+}
+
+$(document).ready(function() {
+  loadlive2d('soloKanbanniang', latkeConfig.staticServePath +
+      '/plugins/kanbanniang/assert/model.json');
+});
\ No newline at end of file

src/main/webapp/skins/nijigen/kanban/model.json → src/main/webapp/plugins/kanbanniang/assert/model.json

@@ -2,7 +2,7 @@
     "version":"1.0.0",
     "model":"model.moc",
     "textures":[
-        "textures/Star Witch Costume.png"
+        "textures/Animal Costume.png"
     ],
     "layout":{
         "center_x":0.0,

src/main/webapp/skins/nijigen/index.ftl → src/main/webapp/plugins/kanbanniang/plugin.ftl

@@ -17,29 +17,20 @@
     along with this program.  If not, see <https://www.gnu.org/licenses/>.
 
 -->
-<#include "macro-head.ftl">
-<!DOCTYPE html>
-<html>
-    <head>
-        <@head title="${blogTitle}">
-        <#if metaKeywords??>
-        <meta name="keywords" content="${metaKeywords}"/>
-        </#if>
-        <#if metaDescription??>
-        <meta name="description" content="${metaDescription}"/>
-        </#if>
-        </@head>
-    </head>
-    <body>
-        <#include "header.ftl">
-        <div class="wrapper">
-            <div class="main-wrap">
-                <main>
+<script src="${staticServePath}/plugins/kanbanniang/assert/live2d.js"></script>
+<script async src="${staticServePath}/plugins/kanbanniang/assert/index.js"></script>
+<div class="solo-kanbanniang">
+    <div class="solo-kanbanniang__tip"></div>
+    <canvas id="soloKanbanniang" width="280" height="250"></canvas>
+    <div class="solo-kanbanniang__tool">
+        <svg id="icon-home" viewBox="0 0 32 32" width="100%" height="100%">
+            <path d="M32 18.967l-16-12.42-16 12.42v-5.064l16-12.42 16 12.42zM28 18.516v12h-8v-8h-8v8h-8v-12l12-9z"></path>
+        </svg>
+        <span class="fui-eye">eye</span>
+        <span class="fui-chat">chat</span>
+        <span class="fui-user">user</span>
+        <span class="fui-photo">photo</span>
+        <span class="fui-info-circle">circle</span>
+        <span class="fui-cross">cross</span>
+    </div>
+</div>
\ No newline at end of file
-                    <#include "article-list.ftl">
-                </main>
-                <#include "side.ftl">
-            </div>
-        </div>
-        <#include "footer.ftl">
-    </body>
-</html>
\ No newline at end of file

src/main/webapp/skins/nijigen/skin.properties → src/main/webapp/plugins/kanbanniang/plugin.properties

@@ -17,10 +17,17 @@
 #
 
 #
-# Description: Spaces skin.
-# Version: 1.0.0.0, May 29, 2018
+# Description: Description of plugin kanbanniang.
+# Version: 1.0.0.0, Jul 5, 2018
 # Author: Liyuan Li
 #
+rendererId=footer.ftl
+author=<a href="http://vanessa.b3log.org">Vanessa</a>
+name=\u770B\u677F\u5A18
+version=0.0.1
+types=PUBLIC
 
-name=nijigen
-memo=https://github.com/ZEROKISEKI/hexo-theme-gal
+classesDirPath=/WEB-INF/classes/
+
+pluginClass=
+eventListenerClasses=
\ No newline at end of file

src/main/webapp/skins/nijigen/archive-articles.ftl

-<#--
-
-    Solo - A beautiful, simple, stable, fast Java blogging system.
-    Copyright (c) 2010-2018, b3log.org & hacpai.com
-
-    This program is free software: you can redistribute it and/or modify
-    it under the terms of the GNU Affero General Public License as published by
-    the Free Software Foundation, either version 3 of the License, or
-    (at your option) any later version.
-
-    This program is distributed in the hope that it will be useful,
-    but WITHOUT ANY WARRANTY; without even the implied warranty of
-    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-    GNU Affero General Public License for more details.
-
-    You should have received a copy of the GNU Affero General Public License
-    along with this program.  If not, see <https://www.gnu.org/licenses/>.
-
--->
-<#include "macro-head.ftl">
-<!DOCTYPE html>
-<html>
-    <head>
-        <@head title="${archiveDate.archiveDateMonth} ${archiveDate.archiveDateYear} (${archiveDate.archiveDatePublishedArticleCount}) - ${blogTitle}">
-        <meta name="keywords" content="${metaKeywords},${archiveDate.archiveDateYear}${archiveDate.archiveDateMonth}"/>
-        <meta name="description" content="<#list articles as article>${article.articleTitle}<#if article_has_next>,</#if></#list>"/>
-        </@head>
-    </head>
-    <body>
-        <#include "header.ftl">
-        <div class="wrapper">
-            <div class="main-wrap">
-                <main>
-                    <div class="title">
-                        <h2 class="tip">
-                            <i class="icon-inbox"></i>
-                            &nbsp;
-                            <#if "en" == localeString?substring(0, 2)>
-                            ${archiveDate.archiveDateMonth} ${archiveDate.archiveDateYear}
-                            <#else>
-                                ${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel}
-                            </#if>
-                            - ${archiveDate.archiveDatePublishedArticleCount} ${articleLabel}
-                        </h2>
-                    </div>
-                    <#include "article-list.ftl">
-                </main>
-                <#include "side.ftl">
-            </div>
-        </div>
-        <#include "footer.ftl">
-    </body>
-</html>

src/main/webapp/skins/nijigen/archives.ftl

-<#--
-
-    Solo - A beautiful, simple, stable, fast Java blogging system.
-    Copyright (c) 2010-2018, b3log.org & hacpai.com
-
-    This program is free software: you can redistribute it and/or modify
-    it under the terms of the GNU Affero General Public License as published by
-    the Free Software Foundation, either version 3 of the License, or
-    (at your option) any later version.
-
-    This program is distributed in the hope that it will be useful,
-    but WITHOUT ANY WARRANTY; without even the implied warranty of
-    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-    GNU Affero General Public License for more details.
-
-    You should have received a copy of the GNU Affero General Public License
-    along with this program.  If not, see <https://www.gnu.org/licenses/>.
-
--->
-<#include "macro-head.ftl">
-<!DOCTYPE html>
-<html>
-    <head>
-        <@head title="${blogTitle}">
-        <meta name="keywords" content="${metaKeywords},${archiveLabel}"/>
-        <meta name="description" content="${metaDescription},${archiveLabel}"/>
-        </@head>
-    </head>
-    <body>
-        <#include "header.ftl">
-        <div class="wrapper">
-            <div class="main-wrap">
-                <main class="other">
-                    <span class="title">
-                         <h2><i class="icon-inbox"></i>
-                             &nbsp;${statistic.statisticPublishedBlogArticleCount} ${articleLabel}</h2>
-                    </span>
-                    <#if 0 != archiveDates?size>
-                        <ul class="list">
-                        <#list archiveDates as archiveDate>
-                            <li>
-                                <#if "en" == localeString?substring(0, 2)>
-                                    <a class="post-title" href="${servePath}/archives/${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}">
-                                        ${archiveDate.monthName} ${archiveDate.archiveDateYear}(${archiveDate.archiveDatePublishedArticleCount})
-                                    </a>
-                                    <#else>
-                                        <a class="post-title" href="${servePath}/archives/${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}">
-                                            ${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel}(${archiveDate.archiveDatePublishedArticleCount})
-                                        </a>
-                                </#if>
-                            </li>
-                        </#list>
-                        </ul>
-                    </#if>
-                </main>
-                <#include "side.ftl">
-            </div>
-        </div>
-        <#include "footer.ftl">
-    </body>
-</html>

src/main/webapp/skins/nijigen/article-list.ftl

-<#--
-
-    Solo - A beautiful, simple, stable, fast Java blogging system.
-    Copyright (c) 2010-2018, b3log.org & hacpai.com
-
-    This program is free software: you can redistribute it and/or modify
-    it under the terms of the GNU Affero General Public License as published by
-    the Free Software Foundation, either version 3 of the License, or
-    (at your option) any later version.
-
-    This program is distributed in the hope that it will be useful,
-    but WITHOUT ANY WARRANTY; without even the implied warranty of
-    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-    GNU Affero General Public License for more details.
-
-    You should have received a copy of the GNU Affero General Public License
-    along with this program.  If not, see <https://www.gnu.org/licenses/>.
-
--->
-<div>
-    <#list articles as article>
-    <article class="post">
-        <header>
-            <h1>
-                <a rel="bookmark" href="${servePath}${article.articlePermalink}">
-                    ${article.articleTitle}
-                </a>
-                <#if article.articlePutTop>
-                <sup>
-                    ${topArticleLabel}
-                </sup>
-                </#if>
-                <#if article.hasUpdated>
-                <sup>
-                    ${updatedLabel}
-                </sup>
-                </#if>
-            </h1>
-
-            <div class="meta">
-                <span class="tooltipped tooltipped-n" aria-label="${createDateLabel}">
-                    <i class="icon-date"></i>
-                    <time>
-                        ${article.articleCreateDate?string("yyyy-MM-dd")}
-                    </time>
-                </span>
-                &nbsp; | &nbsp;
-                <span class="tooltipped tooltipped-n" aria-label="${commentCountLabel}">
-                    <i class="icon-comments"></i>
-                    <a href="${servePath}${article.articlePermalink}#comments">
-                        ${article.articleCommentCount} ${commentLabel}</a>
-                </span>
-                &nbsp; | &nbsp;
-                <span class="tooltipped tooltipped-n" aria-label="${viewCountLabel}">
-                    <i class="icon-views"></i>
-                    ${article.articleViewCount} ${viewLabel}
-                </span>
-            </div>
-        </header>
-        <div class="content-reset">
-            ${article.articleAbstract}
-        </div>
-        <footer class="fn-clear tags">
-            <#list article.articleTags?split(",") as articleTag>
-                <a class="tag" rel="tag" href="${servePath}/tags/${articleTag?url('UTF-8')}">
-                    ${articleTag}</a>
-            </#list>
-            <a href="${servePath}${article.articlePermalink}#more" rel="contents" class="fn-right">
-                ${readLabel} &raquo;
-            </a>
-        </footer>
-    </article>
-    </#list>
-
-
-    <#if 0 != paginationPageCount>
-        <div class="fn-clear">
-            <nav class="pagination fn-right">
-                <#if 1 != paginationPageNums?first>
-                <a href="${servePath}${path}/${paginationPreviousPageNum}" class="page-number">&laquo;</a>
-                    <a class="page-number" href="${servePath}${path}/1">1</a> <span class="page-number">...</span>
-                </#if>
-                <#list paginationPageNums as paginationPageNum>
-                <#if paginationPageNum == paginationCurrentPageNum>
-                <span class="page-number current">${paginationPageNum}</span>
-                <#else>
-                <a class="page-number" href="${servePath}${path}/${paginationPageNum}">${paginationPageNum}</a>
-                </#if>
-                </#list>
-                <#if paginationPageNums?last != paginationPageCount> <span class="page-number">...</span>
-                <a href="${servePath}${path}/${paginationPageCount}" class="page-number">${paginationPageCount}</a>
-                <a href="${servePath}${path}/${paginationNextPageNum}" class="page-number">&raquo;</a>
-                </#if>
-            </nav>
-        </div>
-    </#if>
-</div>
\ No newline at end of file

src/main/webapp/skins/nijigen/article.ftl

-<#--
-
-    Solo - A beautiful, simple, stable, fast Java blogging system.
-    Copyright (c) 2010-2018, b3log.org & hacpai.com
-
-    This program is free software: you can redistribute it and/or modify
-    it under the terms of the GNU Affero General Public License as published by
-    the Free Software Foundation, either version 3 of the License, or
-    (at your option) any later version.
-
-    This program is distributed in the hope that it will be useful,
-    but WITHOUT ANY WARRANTY; without even the implied warranty of
-    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-    GNU Affero General Public License for more details.
-
-    You should have received a copy of the GNU Affero General Public License
-    along with this program.  If not, see <https://www.gnu.org/licenses/>.
-
--->
-<#include "macro-head.ftl">
-<#include "macro-comments.ftl">
-<!DOCTYPE html>
-<html>
-    <head>
-        <@head title="${article.articleTitle} - ${blogTitle}">
-        <meta name="keywords" content="${article.articleTags}" />
-        <meta name="description" content="${article.articleAbstract?html}" />
-        </@head>
-        <#if previousArticlePermalink??>
-            <link rel="prev" title="${previousArticleTitle}" href="${servePath}${previousArticlePermalink}">
-        </#if>
-        <#if nextArticlePermalink??>
-            <link rel="next" title="${nextArticleTitle}" href="${servePath}${nextArticlePermalink}">
-        </#if>
-            <!-- Open Graph -->
-            <meta property="og:locale" content="zh_CN"/>
-            <meta property="og:type" content="article"/>
-            <meta property="og:title" content="${article.articleTitle}"/>
-            <meta property="og:description" content="${article.articleAbstract?html}"/>
-            <meta property="og:image" content="${article.authorThumbnailURL}"/>
-            <meta property="og:url" content="${servePath}${article.articlePermalink}"/>
-            <meta property="og:site_name" content="Solo"/>
-            <!-- Twitter Card -->
-            <meta name="twitter:card" content="summary"/>
-            <meta name="twitter:description" content="${article.articleAbstract?html}"/>
-            <meta name="twitter:title" content="${article.articleTitle}"/>
-            <meta name="twitter:image" content="${article.authorThumbnailURL}"/>
-            <meta name="twitter:url" content="${servePath}${article.articlePermalink}"/>
-            <meta name="twitter:site" content="@DL88250"/>
-            <meta name="twitter:creator" content="@DL88250"/>
-    </head>
-    <body>
-        <#include "header.ftl">
-        <div class="wrapper">
-            <div class="main-wrap">
-                <main>
-                    <article class="post">
-                        <header>
-                            <h1>
-                                <a rel="bookmark" href="${servePath}${article.articlePermalink}">
-                                    ${article.articleTitle}
-                                </a>
-                                <#if article.articlePutTop>
-                                    <sup>
-                                        ${topArticleLabel}
-                                    </sup>
-                                </#if>
-                                <#if article.hasUpdated>
-                                    <sup>
-                                        ${updatedLabel}
-                                    </sup>
-                                </#if>
-                            </h1>
-                            <div class="meta">
-                                <span class="tooltipped tooltipped-n" aria-label="${createDateLabel}">
-                                    <i class="icon-date"></i>
-                                    <time>
-                                        ${article.articleCreateDate?string("yyyy-MM-dd")}
-                                    </time>
-                                </span>
-                                                &nbsp; | &nbsp;
-                                                <span class="tooltipped tooltipped-n" aria-label="${commentCountLabel}">
-                                    <i class="icon-comments"></i>
-                                    <a href="${servePath}${article.articlePermalink}#comments">
-                                        ${article.articleCommentCount} ${commentLabel}</a>
-                                </span>
-                                                &nbsp; | &nbsp;
-                                                <span class="tooltipped tooltipped-n" aria-label="${viewCountLabel}">
-                                    <i class="icon-views"></i>
-                                    ${article.articleViewCount} ${viewLabel}
-                                </span>
-                            </div>
-                        </header>
-
-                        <div class="content-reset">
-                            ${article.articleContent}
-                            <#if "" != article.articleSign.signHTML?trim>
-                                <div>
-                                    ${article.articleSign.signHTML}
-                                </div>
-                            </#if>
-                        </div>
-
-                        <footer class="tags">
-                            <#list article.articleTags?split(",") as articleTag>
-                                <a class="tag" rel="tag" href="${servePath}/tags/${articleTag?url('UTF-8')}">
-                                    ${articleTag}</a>
-                            </#list>
-
-                            <#-- div class="copyright">
-                                ${articleCP1Label}
-                                <a rel="bookmark" href="${servePath}${article.articlePermalink}">
-                                    ${article.articleTitle}
-                                </a> -
-                                <a href="${servePath}">
-                                    ${blogTitle}
-                                </a>
-                            </div -->
-
-                            <div class="rel fn-clear">
-                                <#if previousArticlePermalink??>
-                                    <a href="${servePath}${previousArticlePermalink}" rel="prev"
-                                       class="fn-left tooltipped tooltipped-n"
-                                       aria-label="${previousArticleTitle}">
-                                        ${previousArticleLabel}
-                                    </a>
-                                </#if>
-                                <#if nextArticlePermalink??>
-                                    <a href="${servePath}${nextArticlePermalink}" rel="next"
-                                       class="fn-right tooltipped tooltipped-n"
-                                       aria-label="${nextArticleTitle}">
-                                        ${nextArticleLabel}
-                                    </a>
-                                </#if>
-                            </div>
-                        </footer>
-                        <@comments commentList=articleComments article=article></@comments>
-                        <div id="externalRelevantArticles" class="list"></div>
-                        <div id="relevantArticles" class="list"></div>
-                        <div id="randomArticles" class="list"></div>
-                    </article>
-                </main>
-                <#include "side.ftl">
-            </div>
-        </div>
-        <#include "footer.ftl">
-        <@comment_script oId=article.oId>
-        page.tips.externalRelevantArticlesDisplayCount = "${externalRelevantArticlesDisplayCount}";
-        <#if 0 != randomArticlesDisplayCount>
-        page.loadRandomArticles();
-        </#if>
-        <#if 0 != externalRelevantArticlesDisplayCount>
-        page.loadExternalRelevantArticles("<#list article.articleTags?split(",") as articleTag>${articleTag}<#if articleTag_has_next>,</#if></#list>"
-            , "<header class='title'><h2>${externalRelevantArticlesLabel}</h2></header>");
-        </#if>
-        <#if 0 != relevantArticlesDisplayCount>
-        page.loadRelevantArticles('${article.oId}', '<h4>${relevantArticlesLabel}</h4>');
-        </#if>
-        </@comment_script>    
-    </body>
-</html>

src/main/webapp/skins/nijigen/category-articles.ftl

-<#--
-
-    Solo - A beautiful, simple, stable, fast Java blogging system.
-    Copyright (c) 2010-2018, b3log.org & hacpai.com
-
-    This program is free software: you can redistribute it and/or modify
-    it under the terms of the GNU Affero General Public License as published by
-    the Free Software Foundation, either version 3 of the License, or
-    (at your option) any later version.
-
-    This program is distributed in the hope that it will be useful,
-    but WITHOUT ANY WARRANTY; without even the implied warranty of
-    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-    GNU Affero General Public License for more details.
-
-    You should have received a copy of the GNU Affero General Public License
-    along with this program.  If not, see <https://www.gnu.org/licenses/>.
-
--->
-<#include "macro-head.ftl">
-<!DOCTYPE html>
-<html>
-    <head>
-        <@head title="${category.categoryTitle} - ${blogTitle}">
-        <meta name="keywords" content="${metaKeywords},${category.categoryTitle}"/>
-        <meta name="description" content="<#list articles as article>${article.articleTitle}<#if article_has_next>,</#if></#list>"/>
-        </@head>
-    </head>
-    <body>
-        <#include "header.ftl">
-        <div class="wrapper">
-            <div class="main-wrap">
-                <main>
-                    <div class="title">
-                        <h2 class="tip"><i class="icon-category"></i>
-                            &nbsp;${category.categoryTitle}
-                            <small>${category.categoryDescription}</small>
-                        </h2>
-
-                    </div>
-                    <#include "article-list.ftl">
-                </main>
-                <#include "side.ftl">
-            </div>
-        </div>
-        <#include "footer.ftl">
-    </body>
-</html>