作者注：本文将持续更新

本文记录折腾hexo主题的过程。主要参考技术博客和工作室网站。

yaml支持

hexo新版本（3.0）支持yaml数据文件。在 source 目录建立data.yml，可在 ejs 代码中引入。修改数据文件，无须重启服务。方便将数据和页面分离。此功能可导航条、链接、提示语，等功能。

使用示例：
links.yml文件：

links:
  - title: 李迟的专栏
    url: https://latelee.blog.csdn.net/
  - title: 李迟的个人主页
    url: https://i.latelee.org
  - title: 本站备份网址
    url: https://latelee.github.io/

相应 links.ejs 文件：

<% const {links} = site.data.links; %> <% if (links) {%>
<div class="widget-wrap"><h3 class="widget-title"><%= __('links') %></h3>
  <div class="widget">
    <ul class="clearfix">
      <% links.forEach(({title, url},) => { %><li>
      <i class="fas fa-link"></i><a href="<%- url %>" target="_blank"><%- title %></a>
      <% }) %></li>
    </ul>
  </div>
<% } %></div>

<% const {links} = site.data.links; %> 为导入数据文件固定形式，{links} 为变量名，site.data.links 表示 links.yml 文件。该方式只是引入数据形式不同，与config.yml本质一样（只是修改config.yml需要重启服务）。

导航条更新

yaml文件：

headerNav:
  - title: 嵌入式/Linux
    sub:
      - title: GUN/Linux系统
        href: /category/using-gnu-linux
        div: true
      - title: Linux内核研究
        href: /category/linux-kernel
      - title: 嵌入式Linux
        href: /category/embedded-linux
      - title: U-Boot随笔
        href: /category/porting-uboot
        div: true
      - title: 嵌入式底层BIOS
        href: /category/firmware-bios
        div: true
      - title: qemu
        href: /tag/嵌入式qemu
      - title: 树莓派
        href: /tag/raspberrypi

  - title: 程序开发
    sub:
      - title: 技术杂铺
        href: /category/my-study
      - title: 开源项目
        href: /category/open-project
      - title: 程序库
        href: /category/my-library
        div: true
      - title: 流媒体
        href: /category/multistream
      - title: 无线WIFI
        href: /category/wireless
      - title: 网络/网站/web
        href: /category/
        div: true
      - title: 小玩意
        href: /category/just-for-fun
      - title: 答网友问
        href: /category/answer4you
  - title: 文章归档
    href: /archives
  - title: 本站信息
    href: /webinfo

相应实现代码：

<% const {rightNav, headerNav} = site.data.menu; %> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
    <ul class="nav navbar-nav">
      <% headerNav.forEach(({title, href, href_match, sub}, index) => { %><% if (! sub) { %> 
        <li><a href="<%= href %>"><%= title %></a></li> 
          <% } else { %><li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button"  aria-haspopup="true" aria-expanded="false" id="Nav_<%= index %>" href="<%= href %>">
                <%= title %><span class="caret"></span></a>
              <ul class="dropdown-menu"><% sub.forEach(({title, href, div}) => { %><li><a href="<%= href %>"> <%= title %></a></li><% if (div) { %> <li role="separator" class="divider"></li> <% } %>
                <% }); %></ul></li>
          <% } %><% }) %></ul>

面包屑功能

在 article.ejs 文章标题下新加：

<% if (is_post()) { %><ul class="breadcrumb">
  <li><a href="/"><%= __('home') %></a></li>
  <li><a href="/archives"><%= __('allpost') %></a></li>
  <li><a href="/archives/<%= post.date.format('YYYY')%>/<%= post.date.format('MM')%>"><%= post.date.format('YYYY')%>年<%= post.date.format('MM') %>月</a></li>
  <li><%- list_categories(post.categories, {
    show_count: false,
    class: 'article-category',
    style: 'none',
    separator: ', '
  }) %>
  </li>
</ul> <% } %>

面包屑依次显示首页、归档文章、发表年月、分类。用 is_post() 判断为文章页面。post.date为文章创建时间，其为momentjs格式，用format可得到相应的数字，如 YYY 为年份，MM为月份。经实验，分类只能通过 list_categories 获取。

参考

hexo官网： https://hexo.io/zh-cn/docs/variables

本站 hexo 自动化过程

本站的 hexo 发布全程自动化，只需将文章源码文件（主题、Markdown 格式文章）提交仓库，触发 CI 构建。

• 使用 github 托管网站源码，通过 cname 映射域名。CI：在 gitlab 中构建，提交到 github 中。缺点：访问慢。
• 解决一台主机多个网站布置。网站使用 https，将网站源码托管到云主机，不映射域名。CI：在 gitlab 中构建，远程拷贝到云主机。缺点：拷贝经常不成功。
• 接上，将网站源码的仓库放到云主机，在CI中直接远程到云主机，使用 git pull 直接更新。

李迟 2019.3.31
更新于 2019.12