添加子页面

HCLonely · Jan 27, 2021 · 45bc01d · 45bc01d
1 parent 1ead276
commit 45bc01d
Show file tree

Hide file tree

Showing 12 changed files with 233 additions and 76 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,3 @@
 node_modules
 .vscode
+.history
diff --git a/README.md b/README.md
@@ -299,3 +299,17 @@ hotTools:
 ```
 
 Either of the above two methods can be selected. The second method is recommended.
+
+## Subpage configuration
+
+### Create subpage
+
+Use `hexo new page xxx` to create a child page, including the following descriptions, using `hexo new page child` as an example.
+
+### Modify the subpage configuration file
+
+After using the above command to generate the subpage, open the `root directory/source/child/index.md` file (subpage configuration file), and add a line `type:'child'` between the two `---` This configuration file takes effect. The sub-page uses the configuration of the homepage by default, and the sub-page preferentially uses the configuration between the two `---` sub-page configuration files. Each configuration item has the same configuration function as the homepage.
+
+See the example[https://github.com/HCLonely/hexo-theme-webstack/tree/gh-pages/source/child/index.md](https://github.com/HCLonely/hexo-theme-webstack/tree/gh-pages/source/child/index.md)
+
+> Since the subpage was basically completed a long time ago, it was later put on hold when it was busy. There may be some configuration or bugs that have been forgotten. If you have any questions, please feedback in time!
diff --git a/README_CN.md b/README_CN.md
@@ -299,3 +299,17 @@ hotTools:
 > 以上两种方式任选一种即可，建议使用第二种。
 
 [配置详情](https://blog.hclonely.com/posts/3cd4fb34/)
+
+## 子页面配置
+
+### 创建子页面
+
+使用`hexo new page xxx`创建子页面，这里包括下面的说明都以`hexo new page child`为例。
+
+### 修改子页面配置文件
+
+使用上面的命令生成子页面后，打开`根目录/source/child/index.md`文件（子页面配置文件），在两个`---`之间添加一行`type: 'child'`使此配置文件生效，子页面默认使用主页的配置，子页面优先使用子页面配置文件两个`---`之间的配置，各配置项和主页的配置功能相同。
+
+示例请看[https://github.com/HCLonely/hexo-theme-webstack/tree/gh-pages/source/child/index.md](https://github.com/HCLonely/hexo-theme-webstack/tree/gh-pages/source/child/index.md)
+
+> 由于子页面在很久之前就基本做完了，后来比较忙就鸽了，可能有些配置或 bug 给忘了，有问题请及时反馈！
diff --git a/_config.yml b/_config.yml
@@ -15,6 +15,9 @@ search: true
 githubCorner: '<a href="https://github.com/HCLonely/hexo-theme-webstack" class="github-corner" aria-label="View source on GitHub"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:#151513; color:#fff; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>'
 
 menu:
+  - name: 测试页面
+    icon: far fa-star
+    config: testPage
   - name: 常用工具
     icon: far fa-star
     config: hotTools
@@ -28,6 +31,11 @@ menu:
         icon: fas fa-blog
         config: myBlog
 
+testPage:
+  - name: Child Page
+    url: /child
+    img: /images/logos/myblog.png
+    description: 子页面测试
 devTools:
   - name: Github
     url: https://github.com/
@@ -37,24 +45,6 @@ devTools:
     url: https://github.com/
     img: /images/logos/github.png
     description: 面向开源及私有软件项目的托管平台。
-  - name: Github
-    url: https://github.com/
-    img: /images/logos/github.png
-    description: 面向开源及私有软件项目的托管平台。
-
-hotTools:
-  - name: Github
-    url: https://github.com/
-    img: /images/logos/github.png
-    description: 面向开源及私有软件项目的托管平台。
-  - name: Github
-    url: https://github.com/
-    img: /images/logos/github.png
-    description: 面向开源及私有软件项目的托管平台。
-  - name: Github
-    url: https://github.com/
-    img: /images/logos/github.png
-    description: 面向开源及私有软件项目的托管平台。
 
 myBlog:
   - name: HCLonely Blog

diff --git a/layout/common/footer.ejs b/layout/common/footer.ejs
@@ -3,13 +3,13 @@
     <!-- Add your copyright text here -->
     <p>
       <% var now = new Date().getFullYear(); %>
-      &copy; <%- theme.since === now ? theme.since : (theme.since + " - " + now) %>
+      &copy; <%- setting.since === now ? setting.since : (setting.since + " - " + now) %>
       <a href="javascript:void(0);"><strong><%- config.author %></strong></a> | Design by <a href="http://viggoz.com" target="_blank"><strong>Viggo</strong></a> | Power by <a href="https://hexo.io/" target="_blank"><strong>Hexo</strong></a> & <a href="https://github.com/HCLonely/hexo-theme-webstack/" target="_blank"><strong>hexo-theme-webstack</strong></a>
     </p>
-    <% if (theme.busuanzi.enable && theme.busuanzi.position === 'footer') { %>
+    <% if (setting.busuanzi.enable && setting.busuanzi.position === 'footer') { %>
     <p>
-      <span id="busuanzi_container_site_pv"><%- theme.busuanzi.pv.replace(/\$pv/i,'<span id="busuanzi_value_site_pv"></span>') %></span> |
-      <span id="busuanzi_container_site_uv"><%- theme.busuanzi.uv.replace(/\$uv/i,'<span id="busuanzi_value_site_uv"></span>') %></span>
+      <span id="busuanzi_container_site_pv"><%- setting.busuanzi.pv.replace(/\$pv/i,'<span id="busuanzi_value_site_pv"></span>') %></span> |
+      <span id="busuanzi_container_site_uv"><%- setting.busuanzi.uv.replace(/\$uv/i,'<span id="busuanzi_value_site_uv"></span>') %></span>
     </p>
     <% } %>
     <div class="go-up">
@@ -21,12 +21,12 @@
 </footer>
 </div>
 </div>
-<%- js([theme.js.bootstrap, theme.js.TweenMax, theme.js.resizeable, theme.js.joinable, theme.js.xenonApi, theme.js.xenonToggles, theme.js.xenonCustom]) %>
-<% if (theme.busuanzi.enable) { %>
-<script async src="<%- theme.js.busuanzi %>"></script>
+<%- js([setting.js.bootstrap, setting.js.TweenMax, setting.js.resizeable, setting.js.joinable, setting.js.xenonApi, setting.js.xenonToggles, setting.js.xenonCustom]) %>
+<% if (setting.busuanzi.enable) { %>
+<script async src="<%- setting.js.busuanzi %>"></script>
 <% } %>
-<% if (is_home()) { %>
-<%- js(theme.js.lozad) %>
+<% if (setting.type!=="about") { %>
+<%- js(setting.js.lozad) %>
 <% } else { %>
 <textarea tabindex="-1" style="position: absolute; top: -999px; left: 0px; right: auto; bottom: auto; border: 0px; padding: 0px; box-sizing: content-box; word-wrap: break-word; overflow: hidden; transition: none; height: 0px !important; min-height: 0px !important; font-family: Arimo, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-size: 13px; font-weight: 400; font-style: normal; letter-spacing: 0px; text-transform: none; word-spacing: 0px; text-indent: 0px; line-height: 18.5714px; width: 53px;" class="autosizejs" id="autosizejs"></textarea>
 <% } %>
diff --git a/layout/common/head.ejs b/layout/common/head.ejs
@@ -3,35 +3,35 @@
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <meta name="author" content="viggo" />
-  <title><%= config.title %> - <%= config.subtitle %></title>
-  <meta name="keywords" content="<%= config.keywords %>">
-  <meta name="description" content="<%= config.description %>">
-  <link rel="shortcut icon" href="<%= theme.favicon %>">
-  <%- css(Object.values(theme.css)) %>
-  <%- js(theme.js.jquery) %>
-  <%- js(theme.js.header) %>
+  <title><%= setting.tittle || config.title %> - <%= setting.subtitle || config.subtitle %></title>
+  <meta name="keywords" content="<%= setting.keywords || config.keywords %>">
+  <meta name="description" content="<%= setting.description || config.description %>">
+  <link rel="shortcut icon" href="<%= setting.favicon %>">
+  <%- css(Object.values(setting.css)) %>
+  <%- js(setting.js.jquery) %>
+  <%- js(setting.js.header) %>
   <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
   <!--[if lt IE 9]>
-        <%- js(theme.js.html5shiv) %>
-        <%- js(theme.js.respond) %>
+        <%- js(setting.js.html5shiv) %>
+        <%- js(setting.js.respond) %>
     <![endif]-->
   <!-- / FB Open Graph -->
   <meta property="og:type" content="article">
   <meta property="og:url" content="<%= url %>">
-  <meta property="og:title" content="<%= config.title %> - <%= config.subtitle %>">
-  <meta property="og:description" content="<%= config.description %>">
-  <meta property="og:site_name" content="<%= config.title %> - <%= config.subtitle %>">
-  <% if (theme.banner) { %>
-  <meta property="og:image" content="<%= theme.banner %>">
+  <meta property="og:title" content="<%= setting.tittle || config.title %> - <%= setting.subtitle || config.subtitle %>">
+  <meta property="og:description" content="<%= setting.description || config.description %>">
+  <meta property="og:site_name" content="<%= setting.tittle || config.title %> - <%= setting.subtitle || config.subtitle %>">
+  <% if (setting.banner) { %>
+  <meta property="og:image" content="<%= setting.banner %>">
   <% } %>
   <!-- / Twitter Cards -->
   <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:title" content="<%= config.title %> - <%= config.subtitle %>">
-  <meta name="twitter:description" content="<%= config.description %>">
-  <% if (theme.banner) { %>
-  <meta name="twitter:image" content="<%= theme.banner %>">
+  <meta name="twitter:title" content="<%= setting.tittle || config.title %> - <%= setting.subtitle || config.subtitle %>">
+  <meta name="twitter:description" content="<%= setting.description || config.description %>">
+  <% if (setting.banner) { %>
+  <meta name="twitter:image" content="<%= setting.banner %>">
   <% } %>
-  <% if (theme.custom && theme.custom.head) { %>
-  <%- theme.custom.head %>
+  <% if (setting.custom && setting.custom.head) { %>
+  <%- setting.custom.head %>
   <% } %>
 </head>
diff --git a/layout/common/header.ejs b/layout/common/header.ejs
@@ -3,10 +3,10 @@
     <header class="logo-env">
       <div class="logo">
         <a href="/index.html" class="logo-expanded">
-          <img src="<%= theme.logo.expanded %>" width="100%" alt="" />
+          <img src="<%= setting.logo.expanded %>" width="100%" alt="" />
         </a>
         <a href="/index.html" class="logo-collapsed">
-          <img src="<%= theme.logo.collapsed %>" width="40" alt="" />
+          <img src="<%= setting.logo.collapsed %>" width="40" alt="" />
         </a>
       </div>
       <div class="mobile-menu-toggle visible-xs">
@@ -19,7 +19,7 @@
       </div>
     </header>
     <ul id="main-menu" class="main-menu">
-      <% for( let e of theme.menu ) { %>
+      <% for( let e of setting.menu ) { %>
       <li>
         <% if (e.submenu) { %>
         <a class="fas fa-angle-down" style="cursor: pointer;">
@@ -43,25 +43,25 @@
           <% } %>
       </li>
       <% } %>
-      <% if (theme.about) { %>
+      <% if (setting.about) { %>
       <li class="submit-tag">
-        <a href="<%= url_for(theme.about.url) %>">
-          <i class="<%= theme.about.icon %>"></i>
-          <span class="tooltip-blue"><%= theme.about.name %></span>
+        <a href="<%= url_for(setting.about.url) %>">
+          <i class="<%= setting.about.icon %>"></i>
+          <span class="tooltip-blue"><%= setting.about.name %></span>
         </a>
       </li>
       <% } %>
-      <% if (theme.busuanzi.enable && theme.busuanzi.position === 'sidebar') { %>
+      <% if (setting.busuanzi.enable && setting.busuanzi.position === 'sidebar') { %>
       <li>
         <a href="javascript:void(0)">
           <i class="fas fa-eye"></i>
-          <span id="busuanzi_container_site_pv"><%- theme.busuanzi.pv.replace(/\$pv/i,'<span id="busuanzi_value_site_pv"></span>') %></span>
+          <span id="busuanzi_container_site_pv"><%- setting.busuanzi.pv.replace(/\$pv/i,'<span id="busuanzi_value_site_pv"></span>') %></span>
         </a>
       </li>
       <li>
         <a href="javascript:void(0)">
           <i class="fas fa-users"></i>
-          <span id="busuanzi_container_site_uv"><%- theme.busuanzi.uv.replace(/\$uv/i,'<span id="busuanzi_value_site_uv"></span>') %></span>
+          <span id="busuanzi_container_site_uv"><%- setting.busuanzi.uv.replace(/\$uv/i,'<span id="busuanzi_value_site_uv"></span>') %></span>
         </a>
       </li>
       <% } %>

diff --git a/layout/index.ejs b/layout/index.ejs
@@ -1,6 +1,9 @@
+<% const isChildPage = page.type === 'child' %>
+<% const setting = isChildPage ? Object.assign(theme, page) : theme %>
+<% console.log(page.path) %>
 <body class="page-body">
 <div class="page-container">
-<%- partial('common/header') %>
+<%- partial('common/header', {setting:setting}) %>
 
 <div class="main-content">
   <nav class="navbar user-info-navbar" role="navigation">
@@ -12,12 +15,12 @@
       </li>
       <li class="dropdown hover-line language-switcher">
         <a href="/index.html" class="dropdown-toggle" data-toggle="dropdown">
-          <img src="/images/flags/<%= theme.flag.icon %>.png" alt="<%= theme.flag.icon %>" /> <%= theme.flag.name %>
+          <img src="/images/flags/<%= setting.flag.icon %>.png" alt="<%= setting.flag.icon %>" /> <%= setting.flag.name %>
         </a>
         <ul class="dropdown-menu languages">
           <li class="active">
             <a href="/index.html">
-              <img src="/images/flags/<%= theme.flag.icon %>.png" alt="<%= theme.flag.icon %>" alt="<%= theme.flag.icon %>" /> <%= theme.flag.name %>
+              <img src="/images/flags/<%= setting.flag.icon %>.png" alt="<%= setting.flag.icon %>" alt="<%= setting.flag.icon %>" /> <%= setting.flag.name %>
             </a>
           </li>
         </ul>
@@ -30,11 +33,11 @@
         </a>
       </li>
     </ul>
-    <% if (theme.githubCorner) { %>
-    <%- theme.githubCorner %>
+    <% if (setting.githubCorner) { %>
+    <%- setting.githubCorner %>
     <% } %>
     </nav>
-    <% if(theme.search){ %>
+    <% if(setting.search){ %>
     <section class="sousuo">
       <div class="search">
         <div class="search-box">
@@ -58,15 +61,23 @@
     </section>
     <script>search()</script>
   <% } %>
-    <% theme.menu.forEach(function(e) { %>
+  <% if(is_home() || isChildPage){ %>
+  <% const menuSetting = isChildPage ? page : theme; %>
+    <% menuSetting.menu.forEach(function(e) { %>
     <% if (e.submenu) { %>
     <% e.submenu.forEach(function(e) { %>
-    <% var menus = site.data && site.data[e.config] ? site.data[e.config] : theme[e.config]; %>
-    <%- partial('common/group.ejs', {e: e, menus: menus}); %>
+    <% const childPath = page.path.replace('index.html', '') + e.config; %>
+    <% const key = isChildPage?childPath:e.config; %>
+    <% var menus = site.data && site.data[key] ? site.data[key] : menuSetting[e.config]; %>
+    <%- partial('common/group.ejs', {e: e, menus: menus || []}); %>
     <% }) %>
     <% } else { %>
-    <% var menus = site.data && site.data[e.config] ? site.data[e.config] : theme[e.config]; %>
-    <%- partial('common/group.ejs', {e: e, menus: menus}); %>
+    <% const childPath = page.path.replace('index.html', '') + e.config; %>
+    <% const key = isChildPage?childPath:e.config; %>
+    <% var menus = site.data && site.data[key] ? site.data[key] : menuSetting[e.config]; %>
+    <% console.log(page.path,childPath,key); %>
+    <%- partial('common/group.ejs', {e: e, menus: menus || []}); %>
     <% } %>
     <% }) %>
-    <%- js(theme.js.footer) %>
+    <% } %>
+    <%- js(setting.js.footer) %>
diff --git a/layout/layout.ejs b/layout/layout.ejs
@@ -1,14 +1,14 @@
 <!DOCTYPE html>
 <html lang="<%= config.language %>">
-
+<% const setting = page ? Object.assign(theme, page) : theme %>
 <head>
-  <%- partial('common/head') %>
+  <%- partial('common/head', {setting:setting}) %>
 </head>
 
 <%- body %>
-  <%- partial('common/footer') %>
-  <% if (theme.custom && theme.custom.body) { %>
-  <%- theme.custom.body %>
+  <%- partial('common/footer', {setting:setting}) %>
+  <% if (setting.custom && setting.custom.body) { %>
+  <%- setting.custom.body %>
   <% } %>
 </body>
 

diff --git a/layout/page.ejs b/layout/page.ejs
@@ -1 +1,6 @@
-<%- partial('about') %>
+<% if(page.type==="about"){ %>
+<%- partial('about') %>
+<% }else if(page.type==="child"){ %>
+<%- partial('index') %>
+<% }else{ %>
+<% } %>
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-webstack",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "A hexo theme based on webstack.",
   "keywords": [
     "hexo",