refactor: make links in header and footer dynamic

ourai · Mar 22, 2023 · 9d8ef12 · 9d8ef12
1 parent 8eca91a
commit 9d8ef12
Show file tree

Hide file tree

Showing 10 changed files with 117 additions and 39 deletions.
diff --git a/src/jekyll/_config.yml b/src/jekyll/_config.yml
@@ -129,7 +129,28 @@ feed:
 # Customized configurations
 # =====
 
-# Modules
-module:
- comment: false
- share: true
+# KnoSys site config
+ksio:
+ navs:
+ - text: 指南
+ url: /guides/
+ - text: 博客
+ url: /posts/
+ - text: 关于
+ children:
+ - text: 本站
+ url: /about/
+ - text: 作者
+ url: https://linxoid.com/ourai/
+ - text: GitHub
+ url: https://github.com/ourai/lime
+ links:
+ - text: OOSS
+ url: https://oss.ourai.ws/
+ - text: 关于
+ url: /about/
+ - text: 资助
+ url: /about/#donation
+ modules:
+ social:
+ share: true
diff --git a/src/jekyll/_includes/footer.html b/src/jekyll/_includes/footer.html
@@ -1,16 +1,17 @@
 <footer class="Page-footer Footer">
  <div class="{% if site.data.local.repos[page.repo] %}container-fluid{% else %}container{% endif %}">
- {% assign site_url = site.baseurl | prepend: site.url %}
  {% assign utm_params = "utm_source=ourai.github.io/lime&utm_medium=common-footer" %}
  <div class="Footer-description">
- <!-- Important links -->
- <nav class="Footer-navs">
- <ul>
- <li><a href="https://oss.ourai.ws/?{{ utm_params }}" title="访问「Ourai Open Source」" target="_blank" rel="external "><span>OOSS</span></a></li>
- <li><a href="{{ '/about/' | prepend: site_url }}"><span>关于</span></a></li>
- <li><a href="https://ourai.ws/sponsor/?{{ utm_params }}" target="_blank" rel="external "><span>赞助</span></a></li>
- </ul>
- </nav>
+ {% if site.ksio.links and site.ksio.links.size > 0 %}
+ <!-- Important links -->
+ <nav class="Footer-navs">
+ <ul>
+ {% for link in site.ksio.links %}
+ <li>{% include partials/link.html link=link wrap=true utm=utm_params %}</li>
+ {% endfor %}
+ </ul>
+ </nav>
+ {% endif %}
  <!-- Copyright -->
  <div class="Footer-copyright">
  <p>&copy; 2015-{{ site.time | date: "%Y" }} <a href="https://ourai.ws/?{{ utm_params }}" target="_blank">欧雷流</a> 版权所有</p>

diff --git a/src/jekyll/_includes/header.html b/src/jekyll/_includes/header.html
@@ -1,29 +1,22 @@
 <header class="Page-header">
  <div class="navbar navbar-static-top">
  <div class="{% if site.data.local.repos[page.repo] %}container-fluid{% else %}container{% endif %}">
- {% assign site_url = site.baseurl | prepend: site.url %}
+ {% assign site_navs = site.ksio.navs %}
  <div class="navbar-header">
- <button class="navbar-toggle collapsed" type="button" data-target=".Page-navs" data-toggle="collapse">
- <span class="sr-only">Toggle navs</span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- </button>
- <a href="{{ '/' | prepend: site_url }}" class="navbar-brand">{{ site.title }}</a>
+ {% if site_navs and site_navs.size > 0 %}
+ <button class="navbar-toggle collapsed" type="button" data-target=".Page-navs" data-toggle="collapse">
+ <span class="sr-only">Toggle navs</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ {% endif %}
+ <a href="{{ '/' | prepend: site.baseurl | prepend: site.url }}" class="navbar-brand">{{ site.title }}</a>
  </div>
  <!-- Nav menus -->
  <nav class="Page-navs navbar-collapse collapse">
  <ul class="nav navbar-nav navbar-right">
- <li><a href="{{ '/guides/' | prepend: site_url }}">指南</a></li>
- <li><a href="{{ '/posts/' | prepend: site_url }}">博客</a></li>
- <li class="dropdown">
- <a class="dropdown-toggle" href="{{ '/about/' | prepend: site_url }}" data-toggle="dropdown">关于 <span class="caret"></span></a>
- <ul class="dropdown-menu">
- <li><a href="{{ '/about/' | prepend: site_url }}">本站</a></li>
- <li><a href="https://linxoid.com/ourai/?utm_source=ourai.github.io/lime&utm_medium=common-header" target="_blank" rel="external ">作者</a></li>
- <li><a href="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/ourai/lime" target="_blank" rel="external ">GitHub</a></li>
- </ul>
- </li>
+ {% include partials/nav-list.html navs=site_navs %}
  </ul>
  </nav>
  </div>

diff --git a/src/jekyll/_includes/metadata/feed.html b/src/jekyll/_includes/metadata/feed.html
@@ -1,4 +1,4 @@
-{% assign feed_config = site.site-modules.social.feed %}
+{% assign feed_config = site.ksio.modules.social.feed %}
 {% if feed_config %}
 <!-- 订阅 -->
 {% if feed_config.atom %}{% feed_meta %}{% endif %}

diff --git a/src/jekyll/_includes/partials/disqus.html b/src/jekyll/_includes/partials/disqus.html
@@ -1,5 +1,5 @@
-{% if site.module.comment == true %}
- {% assign comment_config = site.site-modules.social.comment.disqus %}
+{% assign comment_config = site.ksio.modules.social.comment.disqus %}
+{% if comment_config %}
  {% if jekyll.environment == "production" %}
  {% assign disqus_shortname = comment_config.shortname %}
  {% else %}

diff --git a/src/jekyll/_includes/partials/link.html b/src/jekyll/_includes/partials/link.html
@@ -0,0 +1,18 @@
+{% assign _inc_link = include.link %}
+{% if include.wrap == true %}
+ {% capture _inc_text %}<span>{{ _inc_link.text }}</span>{% endcapture %}
+{% else %}
+ {% assign _inc_text = _inc_link.text %}
+{% endif %}
+{% if _inc_link.url contains "http" %}
+ {% assign _inc_link_url = _inc_link.url | append: "?" | append: include.utm %}
+ {% assign _inc_external = true %}
+{% else %}
+ {% if _inc_link.url %}
+ {% assign _inc_link_url = _inc_link.url | prepend: site.baseurl | prepend: site.url %}
+ {% else %}
+ {% assign _inc_link_url = "javascript:void(0);" %}
+ {% endif %}
+ {% assign _inc_external = false %}
+{% endif %}
+<a href="{{ _inc_link_url }}"{% if _inc_external %} target="_blank" rel="external "{% endif %}>{{ _inc_text }}</a>
diff --git a/src/jekyll/_includes/partials/nav-list.html b/src/jekyll/_includes/partials/nav-list.html
@@ -0,0 +1,13 @@
+{% assign _inc_navs = include.navs %}
+{% if _inc_navs and _inc_navs.size > 0 %}
+ {% for _inc_nav in _inc_navs %}
+ {% if _inc_nav.children %}
+ <li class="dropdown">
+ <a class="dropdown-toggle" href="javascript:void(0);" data-toggle="dropdown">{{ _inc_nav.text }} <span class="caret"></span></a>
+ <ul class="dropdown-menu">{% include partials/nav-list.html navs=_inc_nav.children %}</ul>
+ </li>
+ {% else %}
+ <li>{% include partials/link.html link=_inc_nav utm="utm_source=ourai.github.io/lime&utm_medium=common-header" %}</li>
+ {% endif %}
+ {% endfor %}
+{% endif %}
diff --git a/src/jekyll/_includes/widgets/social.html b/src/jekyll/_includes/widgets/social.html
@@ -1,4 +1,4 @@
-{% if site.module.share == true %}
+{% if site.ksio.modules.social.share == true %}
  <div class="Widget Widget--share">
  <div class="Widget-body">
  <p>分享到<i class="fa fa-share-alt"></i></p>

diff --git a/src/jekyll/_pages/about.md b/src/jekyll/_pages/about.md
@@ -2,10 +2,18 @@
 title: 关于本站
 ---
 
+{% assign utm_params = "utm_source=ourai.github.io/lime&utm_medium=about" %}
+{% assign sponsor_url = "https://ourai.ws/sponsor/?" | append: utm_params %}
+
 本站既是主题的使用文档，又是在线示例——在浏览学习如何使用本主题的同时，又将其所提供的外观和各种布局几乎都体验了个遍，一举两得！
 
 虽说主题支持不同的静态网站生成器（SSG），但本站是基于 Jekyll 构建的，在其他静态网站生成器中使用的效果应该没什么区别。
 
+## 资助
+{:#donation}
+
+若您正在使用或喜欢本主题，请考虑[请我喝杯咖啡]({{ sponsor_url }}#donation){:target="_blank"}{:rel="external "}以表心意；也许除了本主题之外，还看好[我写的文章](https://ourai.ws/posts/?{{ utm_params }}){:target="_blank"}{:rel="external "}和[其他作品](https://oss.ourai.ws/?{{ utm_params }}){:target="_blank"}{:rel="external "}，希望能够保持长期且高质量的产出，也可以考虑[赞助]({{ sponsor_url }}#sponsor){:target="_blank"}{:rel="external "}我，感激不尽！
+
 {% contentfor footer %}
  {% include widgets/social.html %}
  {% include widgets/toc.html %}

diff --git a/src/jekyll/_pages/guides.md b/src/jekyll/_pages/guides.md
@@ -11,31 +11,55 @@ repo: cookbook
 permalink: /guides/
 ---
 
-本主题由[欧雷](https://linxoid.com/ourai/?utm_source=ourai.github.io/lime){:target="_blank"}{:rel="external "}于 2015 年开始设计与开发，并在个人网站「[欧雷流](https://ourai.ws/?utm_source=ourai.github.io/lime){:target="_blank"}{:rel="external "}」上使用多年；在设计时以提高阅读体验和保持简洁风格为最高原则，体现个性在其次。
+本主题由[欧雷](https://linxoid.com/ourai/?utm_source=ourai.github.io/lime){:target="_blank"}{:rel="external "}于 2015 年开始设计与开发，并在个人网站「[欧雷流](https://ourai.ws/?utm_source=ourai.github.io/lime){:target="_blank"}{:rel="external "}」及个人各种开源软件的文档站上使用多年；在设计时以提高阅读体验和保持简洁风格为最高原则，体现个性在其次。
+
+因而，适用于博客、个人网站、API 文档站等以内容为主的网站。
+
+## 支持
+
+在编写主题代码时，尽可能地使用兼容性高的写法，并适配多种网站构建方式——
+
+### 浏览器兼容性
+
+大部分 PC 与移动端现代浏览器。
+
+### 静态网站生成器
+
+- Jekyll（非 gem-based）
+- Hexo（计划中）
 
 ## 依赖
 
 除了具体的静态网站生成器之外，本主题构建在以下技术与服务之上——
 
-### 源码
+### 源码编写
 
 - 内容结构
  - [Markdown](https://www.markdownguide.org/){:target="_blank"}{:rel="external "}（[kramdown](https://kramdown.gettalong.org/){:target="_blank"}{:rel="external "}）
  - [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML){:target="_blank"}{:rel="external "}
+ - [Liquid](https://shopify.dev/docs/api/liquid){:target="_blank"}{:rel="external "}
 - 界面样式
  - [Sass](https://sass-lang.com/){:target="_blank"}{:rel="external "}（SCSS）
  - [CSS](https://developer.mozilla.org/en-US/docs/Web/CSS){:target="_blank"}{:rel="external "}
 - 交互脚本
  - [JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript){:target="_blank"}{:rel="external "}
  - [CoffeeScript](https://coffeescript.org/){:target="_blank"}{:rel="external "}
 
-### 辅助
+### 辅助库
 
 - [Bootstrap v3.3.6](https://getbootstrap.com/docs/3.3/){:target="_blank"}{:rel="external "}
 - [Font Awesome v4.7](https://fontawesome.com/v4/icons/){:target="_blank"}{:rel="external "}
 
-### 社交
+### 社交功能
 
 - [LinXoid](https://linxoid.com/){:target="_blank"}{:rel="external "}
 - [Disqus](https://disqus.com/){:target="_blank"}{:rel="external "} & [DisqusJS](https://disqusjs.skk.moe/){:target="_blank"}{:rel="external "}
 - [Share.js](https://github.com/overtrue/share.js){:target="_blank"}{:rel="external "}
+
+## 使用
+
+虽说本主题源码开源并免费使用，但还是希望能够在使用时保留主题和作者的名字与来源；如果可以，请在网站底部（即 `footer` 中）加上如下 HTML 代码：
+
+{% highlight html %}
+本站主题 <a href="https://ourai.github.io/lime/" target="_blank" rel="external ">Lime</a> 由 <a href="https://linxoid.com/ourai/" target="_blank" rel="external ">欧雷</a> 提供
+{% endhighlight %}