2016-10-10

关联 GitHub, 让 Guozhivip 支持查看文章更新历史

前言

Hexo 的文章源文件就是一个个 Markdown 文本，自己一直把这些文件备份在 GitHub 上。渐渐发觉，如果只把 GitHub 当作普通网盘，那真是有点大材小用了。于是稍作折腾，成功地把 GitHub 上的备份关联到主题中。现在，在文章文末版权区，可以很方便地跳转查看文章更新记录、历史版本以及下载源文件。

version-control

文件处理

文件命名

为了便于文章识别和自动关联文件，文章 Markdown 的文件名应该符合规范。
建议使用文章建立日期.固定链接 YY-MM-DD.permalink.md 的形式。
在文章 [Front-matter] 中设置固定链接 permalink，然后填写文件名，例如本文完整文件名为 2016-01-10.hexo-post-version-control.md
为什么不使用文章标题作为文件名:

一是因为标题偶尔会变动，修改相对麻烦；二是标题可能包含不能用作文件名的符号，导致关联出错。

文件备份

把 hexo/sources/_posts 文件夹同步备份到你的 GitHub 上，不熟悉 Git 的可使用 GitHub Desktop 操作，具体方法自行搜索。

代码添加

把下面 EJS 代码添加到主题文章模板合适位置中，[Guozhivip][] 主题是添加在文末版权区中。参考备份文件在 Github 的链接修改前半部分地址。

yelee/layout/_partial/post/nav.ejsPost Version Control

<% if (post.backup != false){ %>
    <p>
        <span>更新历史:</span><i class="fa fa-github"></i>
        <a href="<文章 Blame 地址>/<%= post.date.format("YYYY-MM-DD") %>.<%= post.slug %>.md" title="顺序查看文章各部分修改记录" target = "_blank">Blame</a>,
        <a href="<文章 History 地址>/<%= post.date.format("YYYY-MM-DD") %>.<%= post.slug %>.md" title="查看文章有关更新记录" target = "_blank">History</a><span class="raw">文本模式:</span><i class="fa fa-file-text-o"></i>
        <a href="<文章 Raw 地址>/<%= post.date.format("YYYY-MM-DD") %>.<%= post.slug %>.md" title="查看 & 下载文章 Markdown 原始文本" target = "_blank"> .md Raw</a>
    </p>
<% } %>

代码简析

<!-- 不设置 backup: false 则默认显示 -->
<% if (post.backup != false){ %>
    <p> 
        <span>更新历史:</span><i class="fa fa-github"></i>
        <!-- 不同功能替换前面超链接即可，文件名不变 -->
        <!-- 文件名生成: <%= post.date.format("YYYY-MM-DD") %>.<%= post.slug %> -->
        <a href="<文章 Blame 地址>/<%= post.date.format("YYYY-MM-DD") %>.<%= post.slug %>.md" title="顺序查看文章各部分修改记录" target = "_blank">Blame</a>,
        <a href="<文章 History 地址>/<%= post.date.format("YYYY-MM-DD") %>.<%= post.slug %>.md" title="查看文章有关更新记录" target = "_blank">History</a><span class="raw">文本模式:</span><i class="fa fa-file-text-o"></i>
        <a href="<文章 Raw 地址>/<%= post.date.format("YYYY-MM-DD") %>.<%= post.slug %>.md" title="查看 & 下载文章 Markdown 原始文本" target = "_blank"> .md Raw</a>
    </p>
<% } %>

Blame

顺序列出文章内容，左侧显示各部分 commit 信息，最后修改时间等。

History

列出与该文件相关的更新记录 (commit)，按路径匹配。我一般直接就用提交时间作为 commit 信息了，想要更直观查看变动的可以在提交时书写更完善的 commit 信息。

History

.md Raw

在线查看或者直接下载文章原始 Markdown 文本。

后记

这是半自动的版本控制，需要手动把文章同步备份到 GitHub；

代码部分的变动基于 [Guozhivip][] 主题，其它主题用户可以参考 [另一篇文章][] 的方法，自行添加代码到合适位置；

小图标来自 Font Awesome，需主题支持才会正常显示；

本文不详解 Hexo 基础知识，有设置项不理解的请先阅读 [Hexo 官方帮助文档][]。

GuoLi

关联 GitHub, 让 Guozhivip 支持查看文章更新历史

前言

文件处理

文件命名

文件备份

代码添加

代码简析

Blame

History

.md Raw

后记

相关链接