Hexo+Github博客搭建之Matery主题安装配置篇

闪烁之狐blinkfox2020-03-172023-06-30

转自：🇺🇸English Document | 国内访问示例 (http://blinkfox.com) | Github 部署演示示例 (https://blinkfox.github.io) | QQ 交流群1（已满）: 926552981 | QQ 交流群2（推荐）: 971887688

这是一个采用 Material Design 和响应式设计的 Hexo 博客主题。

主题特性

简单漂亮，文章内容美观易读
Material Design 设计
响应式设计，博客在桌面端、平板、手机等设备上均能很好的展现
首页轮播文章及每天动态切换 Banner 图片
瀑布流式的博客文章列表（文章无特色图片时会有 24 张漂亮的图片代替）
时间轴式的归档页
词云的标签页和雷达图的分类页
丰富的关于我页面（包括关于我、文章统计图、我的项目、我的技能、相册等）
可自定义的数据的友情链接页面
支持文章置顶和文章打赏
支持 MathJax
TOC 目录
可设置复制文章内容时追加版权信息
可设置阅读文章时做密码验证
Gitalk、Gitment、Valine 和 Disqus 评论模块（推荐使用 Gitalk）
集成了不蒜子统计、谷歌分析（Google Analytics）和文章字数统计等功能
支持在首页的音乐播放和视频播放功能
支持emoji表情，用markdown emoji语法书写直接生成对应的能跳跃的表情。
支持 DaoVoice、Tidio 在线聊天功能。

1. 主题下载与安装

点击传送门下载 master 分支的最新稳定版的代码，解压缩后，将 hexo-theme-matery 的文件夹复制到你 Hexo 的 themes 文件夹中即可。

当然你也可以在你的站点目录文件夹下使用 git clone 命令来下载：直接在站点根目录下执行下面的命令，即可进行主题的下载，主题有两个版本，稳定版本和最新版本(不定期更新优化)，自主选择版本。

1
2

git clone https://github.com/blinkfox/hexo-theme-matery themes/matery     # 稳定版
git clone -b develop https://github.com/blinkfox/hexo-theme-matery themes/matery   #最新版(不定期进行优化更新)

如果主题下载速度比较慢的话，可以从我的码云仓库进行下载，我的码云仓库地址：传送门

注意：在下载主题仓库之前，请先比对仓库更新时间是否与原作者仓库时间一致，如果一致，请执行下面的命令，如果不一致，请联系我进行仓库更新，当然你也可以自己进行相关的更新操作，自主选择！

1
2

git clone https://gitee.com/yafine66/hexo-theme-matery themes/matery     # 稳定版
git clone -b develop https://gitee.com/yafine66/hexo-theme-matery themes/matery   #最新版(不定期进行优化更新)

2. 主题配置

2.1 切换主题

注意：首先需要明白什么是站点配置文件，什么是主题配置文件，站点配置文件就是根目录下的配置文件，比如我的博客文件在F:\blog下，那么站点配置文件就是F:\blog\_config.yml，主题配置文件就是F:\blog\themes\matery\_config.yml。
另外注意，配置文件中的标点符号不要出现中文格式的标点符号，不然运行会出错。

主题下载完成后，将站点配置文件中的theme值修改为你下载主题的文件名，此处为matery，那么值就修改为theme: matery。

一些站点配置文件的其他地方的修改：

语言选择：如果为中文用户，则在language:后添加值zh-CN，如果不修改，默认为英语；
网址修改：url:的值为你的网址名，如http://xxxx.github.io，如果有域名，则修改为你的域名即可，至于有关域名的修改解析，后面我会说到，这里先不说了。
站点配置文件有个per_page属性，建议修改为6的倍数，这样网站在适应设备时，有较好的显示效果。

2.2 新建标签 tags 页面

tags 页是用来展示所有标签的页面，如果在你的博客 source 目录下还没有 tags/index.md 文件，那么你就需要新建一个，命令如下：

1	hexo new page "tags"

编辑你刚刚新建的页面文件 /source/tags/index.md，至少需要以下内容：

---
title: tags
date: 2018-09-30 18:23:38
type: "tags"
layout: "tags"
---

2.3 新建分类 categories 页面

categories 页是用来展示所有分类的页面，如果在你的博客 source 目录下还没有 categories/index.md 文件，那么你就需要新建一个，命令如下：

1	hexo new page "categories"

编辑你刚刚新建的页面文件 /source/categories/index.md，至少需要以下内容：

---
title: categories
date: 2018-09-30 17:25:30
type: "categories"
layout: "categories"
---

2.4 新建关于我 about 页面

about 页是用来展示关于我和我的博客信息的页面，如果在你的博客 source 目录下还没有 about/index.md 文件，那么你就需要新建一个，命令如下：

1	hexo new page "about"

编辑你刚刚新建的页面文件 /source/about/index.md，至少需要以下内容：

---
title: about
date: 2018-09-30 17:25:30
type: "about"
layout: "about"
---

2.5 新建留言板 contact 页面 (可选)

contact 页是用来展示留言板信息的页面，如果在你的博客 source 目录下还没有 contact/index.md 文件，那么你就需要新建一个，命令如下：

1	hexo new page "contact"

编辑你刚刚新建的页面文件 /source/contact/index.md，至少需要以下内容：

---
title: contact
date: 2018-09-30 17:25:30
type: "contact"
layout: "contact"
---

注：本留言板功能依赖于第三方评论系统，请激活你的评论系统才有效果。并且在主题的 _config.yml 文件中，第 19 至 21 行的“菜单”配置，取消关于留言板的注释即可。

2.6 新建友情链接 friends 页面 (可选)

friends 页是用来展示友情链接信息的页面，如果在你的博客 source 目录下还没有 friends/index.md 文件，那么你就需要新建一个，命令如下：

1	hexo new page "friends"

编辑你刚刚新建的页面文件 /source/friends/index.md，至少需要以下内容：

---
title: friends
date: 2018-12-12 21:25:30
type: "friends"
layout: "friends"
---

同时，在你的博客 source 目录下新建 _data 目录，在 _data 目录中新建 friends.json 文件，文件内容如下所示：

[{
    "avatar": "http://image.luokangyuan.com/1_qq_27922023.jpg",
    "name": "码酱",
    "introduction": "我不是大佬，只是在追寻大佬的脚步",
    "url": "http://luokangyuan.com/",
    "title": "前去学习"
}, {
    "avatar": "http://image.luokangyuan.com/4027734.jpeg",
    "name": "闪烁之狐",
    "introduction": "编程界大佬，技术牛，人还特别好，不懂的都可以请教大佬",
    "url": "https://blinkfox.github.io/",
    "title": "前去学习"
}, {
    "avatar": "http://image.luokangyuan.com/avatar.jpg",
    "name": "ja_rome",
    "introduction": "平凡的脚步也可以走出伟大的行程",
    "url": "https://me.csdn.net/jlh912008548",
    "title": "前去学习"
}]

2.7 菜单导航配置

2.7.1. 配置基本菜单导航的名称、路径url和图标icon.

菜单导航名称可以是中文也可以是英文(如：Index或主页)
图标icon 可以在Font Awesome 中查找

menu:
  Index:
    url: /
    icon: fas fa-home
  Tags:
    url: /tags
    icon: fas fa-tags
  Categories:
    url: /categories
    icon: fas fa-bookmark
  Archives:
    url: /archives
    icon: fas fa-archive
  About:
    url: /about
    icon: fas fa-user-circle
  Friends:
    url: /friends
    icon: fas fa-address-book

2.7.2. 二级菜单配置方法

如果你需要二级菜单则可以在原基本菜单导航的基础上如下操作

在需要添加二级菜单的一级菜单下添加children关键字(如:About菜单下添加children)
在children下创建二级菜单的名称name,路径url和图标icon.
注意每个二级菜单模块前要加 -.
注意缩进格式

menu:
  Index:
    url: /
    icon: fas fa-home
  Tags:
    url: /tags
    icon: fas fa-tags
  Categories:
    url: /categories
    icon: fas fa-bookmark
  Archives:
    url: /archives
    icon: fas fa-archive
  About:
    url: /about
    icon: fas fa-user-circle-o
  Friends:
    url: /friends
    icon: fas fa-address-book
  Medias:
    icon: fas fa-list
    children:
      - name: Musics
        url: /musics
        icon: fas fa-music
      - name: Movies
        url: /movies
        icon: fas fa-film
      - name: Books
        url: /books
        icon: fas fa-book
      - name: Galleries
        url: /galleries
        icon: fas fa-image

2.8 添加emoji表情支持（可选的）

本主题新增了对emoji表情的支持，使用到了 hexo-filter-github-emojis 的 Hexo 插件来支持 emoji表情的生成，把对应的markdown emoji语法（::,例如：:smile:）转变成会跳跃的emoji表情，安装命令如下：

1	npm install hexo-filter-github-emojis --save

在 Hexo 根目录下的 _config.yml 文件中，新增以下的配置项：

githubEmojis:
  enable: true
  className: github-emoji
  inject: true
  styles:
  customEmojis:

执行 hexo clean && hexo g 重新生成博客文件，然后就可以在文章中对应位置看到你用emoji语法写的表情了。

2.9 代码高亮

友情提醒：从 Hexo5.0 版本开始自带了 prismjs 代码语法高亮的支持，本主题对此进行了改造支持。

如果你的博客中曾经安装过 hexo-prism-plugin 的插件，那么你须要执行 npm uninstall hexo-prism-plugin 来卸载掉它，否则生成的代码中会有 { 和 } 的转义字符。

然后，修改 Hexo 根目录下 _config.yml 文件中 highlight.enable 的值为 false，并将 prismjs.enable 的值设置为 true，主要配置如下：

highlight:
  enable: false
  line_number: true
  auto_detect: false
  tab_replace: ''
  wrap: true
  hljs: false
prismjs:
  enable: true
  preprocess: true
  line_number: true
  tab_replace: ''

主题中默认的 prismjs 主题是 Tomorrow Night，如果你想定制自己的主题，可以前往 prismjs 下载页面定制下载自己喜欢的主题 css 文件，然后将此 css 主题文件取名为 prism.css，替换掉 hexo-theme-matery 主题文件夹中的 source/libs/prism/prism.css 文件即可。

2.10 搜索

本主题中还使用到了 hexo-generator-search 的 Hexo 插件来做内容搜索，安装命令如下：

1	npm install hexo-generator-search --save

在 Hexo 根目录下的 _config.yml 文件中，新增以下的配置项：

1
2
3

search:
  path: search.xml
  field: post

2.11 中文链接转拼音（建议安装）

如果你的文章名称是中文的，那么 Hexo 默认生成的永久链接也会有中文，这样不利于 SEO，且 gitment 评论对中文链接也不支持。我们可以用 hexo-permalink-pinyin Hexo 插件使在生成文章时生成中文拼音的永久链接。

安装命令如下：

1	npm i hexo-permalink-pinyin --save

在 Hexo 根目录下的 _config.yml 文件中，新增以下的配置项：

1
2
3

permalink_pinyin:
  enable: true
  separator: '-' # default: '-'

注：除了此插件外，hexo-abbrlink 插件也可以生成非中文的链接。

2.12 文章字数统计插件（建议安装）

如果你想要在文章中显示文章字数、阅读时长信息，可以安装 hexo-wordcount插件。

安装命令如下：

1	npm i --save hexo-wordcount

然后只需在本主题下的 _config.yml 文件中，激活以下配置项即可：

wordCount:
  enable: false # 将这个值设置为 true 即可.
  postWordCount: true
  min2read: true
  totalCount: true

2.13 添加 RSS 订阅支持（可选的）

本主题中还使用到了 hexo-generator-feed 的 Hexo 插件来做 RSS，安装命令如下：

1	npm install hexo-generator-feed --save

在 Hexo 根目录下的 _config.yml 文件中，新增以下的配置项：

feed:
  type: atom
  path: atom.xml
  limit: 20
  hub:
  content:
  content_limit: 140
  content_limit_delim: ' '
  order_by: -date
  icon: icon.png
  autodiscovery: true
  template:

其中type·为生成订阅文件的类型，有atom和rss2两种类型，选择其中一种即可，当然也可以都选，具体配置方法如下：

feed:
  # Generate atom feed
  type: atom

  # Generate both atom and rss2 feeds
  type:
    - atom
    - rss2
  path:
    - atom.xml
    - rss2.xml

执行 hexo clean && hexo g 重新生成博客文件，然后在 public 文件夹中即可看到 atom.xml 文件，说明你已经安装成功了。

2.14 添加 DaoVoice 在线聊天功能（可选的）

前往 DaoVoice 官网注册并且获取 app_id，并将 app_id 填入主题的 _config.yml 文件中

2.15 添加 Tidio 在线聊天功能（可选的）

前往 Tidio 官网注册并且获取 Public Key，并将 Public Key 填入主题的 _config.yml 文件中。

2.16 修改页脚

页脚信息可能需要做定制化修改，而且它不便于做成配置信息，所以可能需要你自己去再修改和加工。修改的地方在主题文件的 /layout/_partial/footer.ejs 文件中，包括站点、使用的主题、访问量等。

2.17 添加中文繁简转换

在主题的_config.yml文件中，开启translate为enable: true
开启中文繁简转换如下修改。默认不开启。

1 2	translate: enable: true

2.18 修改社交链接

在主题的 _config.yml 文件中，默认支持 QQ、GitHub 和邮箱等的配置，你可以在主题文件的 /layout/_partial/social-link.ejs 文件中，新增、修改你需要的社交链接地址，增加链接可参考如下代码：

<% if (theme.socialLink.github) { %>
    <a href="<%= theme.socialLink.github %>" class="tooltipped" target="_blank" data-tooltip="访问我的GitHub" data-position="top" data-delay="50">
        <i class="fab fa-github"></i>
    </a>
<% } %>

其中，社交图标（如：fa-github）你可以在 Font Awesome 中搜索找到。以下是常用社交图标的标识，供你参考：

Facebook: fab fa-facebook
Twitter: fab fa-twitter
Google-plus: fab fa-google-plus
Linkedin: fab fa-linkedin
Tumblr: fab fa-tumblr
Medium: fab fa-medium
Slack: fab fa-slack
Sina Weibo: fab fa-weibo
Wechat: fab fa-weixin
QQ: fab fa-qq
Zhihu: fab fa-zhihu

注意: 本主题中使用的 Font Awesome 版本为 5.11.0。

2.19 修改打赏的二维码图片

在主题文件的 source/medias/reward 文件中，你可以替换成你的的微信和支付宝的打赏二维码图片。

2.20 配置音乐播放器（可选的）

新版主题支持接入第三方音乐，如QQ音乐，网易云音乐，酷狗音乐等等

要支持音乐播放，在主题的 _config.yml 配置文件中激活music配置即可：

# 是否在首页显示音乐
music:
  enable: true
  title:     	    #非吸底模式有效
    enable: true
    show: 听听音乐
  server: netease   #require music platform: netease, tencent, kugou, xiami, baidu
  type: playlist    #require song, playlist, album, search, artist
  id: 503838841     #require song id / playlist id / album id / search keyword
  fixed: false      # 开启吸底模式
  autoplay: false   # 是否自动播放
  theme: '#42b983'
  loop: 'all'       # 音频循环播放, 可选值: 'all', 'one', 'none'
  order: 'random'   # 音频循环顺序, 可选值: 'list', 'random'
  preload: 'auto'   # 预加载，可选值: 'none', 'metadata', 'auto'
  volume: 0.7       # 默认音量，请注意播放器会记忆用户设置，用户手动设置音量后默认音量即失效
  listFolded: true  # 列表默认折叠

server可选netease（网易云音乐），tencent（QQ音乐），kugou（酷狗音乐），xiami（虾米音乐），
baidu（百度音乐）。
type可选song（歌曲），playlist（歌单），album（专辑），search（搜索关键字），artist（歌手）
id获取示例: 浏览器打开网易云音乐，点击我喜欢的音乐歌单，地址栏有一串数字，playlist的id即为这串数字。

2.21 添加note

类似于外挂标签的用法

Usage：

1
2
3

{% note [class] [no-icon] [summary] %}
Any content (support inline tags too).
{% endnote %}

[class] : Optional parameter. Supported values: default | primary | success | info | warning | danger.
[no-icon] : Optional parameter. Disable icon in note.
[summary] : Optional parameter. Optional summary of the note.

All parameters are optional.

example：

{% note %}
#### Header
(without define class style)
{% endnote %}

2.22添加button

Usage：

1	{% button url, text, icon [class], [title] %}

1	{% btn url, text, icon [class], [title] %}

url : Absolute or relative path to URL.
text : Button text. Required if no icon specified.
icon : Font Awesome icon name. Required if no text specified.
[class] : Optional parameter. Font Awesome class(es): fa-fw | fa-lg | fa-2x | fa-3x | fa-4x | fa-5x
[title] : Optional parameter. Tooltip at mouseover.

Examples：

1	{% button #, Text %}

3. 文章 Front-matter 介绍

Front-matter 选项详解

Front-matter 选项中的所有内容均为非必填的。但我仍然建议至少填写 title 和 date 的值。

配置选项	默认值	描述
title	`Markdown` 的文件标题	文章标题，强烈建议填写此选项
date	文件创建时的日期时间	发布时间，强烈建议填写此选项，且最好保证全局唯一
author	根 `_config.yml` 中的 `author`	文章作者
img	`featureImages` 中的某个值	文章特征图，推荐使用图床(腾讯云、七牛云、又拍云等)来做图片的路径。如: http://xxx.com/xxx.jpg
top	`true`	推荐文章（文章是否置顶），如果 `top` 值为 `true`，则会作为首页推荐文章
cover	`false`	`v1.0.2`版本新增，表示该文章是否需要加入到首页轮播封面中
coverImg	无	`v1.0.2`版本新增，表示该文章在首页轮播封面需要显示的图片路径，如果没有，则默认使用文章的特色图片
password	无	文章阅读密码，如果要对文章设置阅读验证密码的话，就可以设置 `password` 的值，该值必须是用 `SHA256` 加密后的密码，防止被他人识破。前提是在主题的 `config.yml` 中激活了 verifyPassword选项
toc	`true`	是否开启 TOC，可以针对某篇文章单独关闭 TOC 的功能。前提是在主题的 `config.yml` 中激活了 `toc` 选项
mathjax	`false`	是否开启数学公式支持，本文章是否开启 `mathjax`，且需要在主题的 `_config.yml` 文件中也需要开启才行
summary	无	文章摘要，自定义的文章摘要内容，如果这个属性有值，文章卡片摘要就显示这段文字，否则程序会自动截取文章的部分内容作为摘要
categories	无	文章分类，本主题的分类表示宏观上大的分类，只建议一篇文章一个分类
tags	无	文章标签，一篇文章可以多个标签
reprintPolicy	cc_by	文章转载规则，可以是 cc_by, cc_by_nd, cc_by_sa, cc_by_nc, cc_by_nc_nd, cc_by_nc_sa, cc0, noreprint 或 pay 中的一个

注意:

如果 img 属性不填写的话，文章特色图会根据文章标题的 hashcode 的值取余，然后选取主题中对应的特色图片，从而达到让所有文章都的特色图各有特色。
date 的值尽量保证每篇文章是唯一的，因为本主题中 Gitalk 和 Gitment 识别 id 是通过 date 的值来作为唯一标识的。
如果要对文章设置阅读验证密码的功能，不仅要在 Front-matter 中设置采用了 SHA256 加密的 password 的值，还需要在主题的 _config.yml 中激活了配置。有些在线的 SHA256 加密的地址，可供你使用：开源中国在线工具、chahuo、站长工具。
您可以在文章md文件的 front-matter 中指定 reprintPolicy 来给单个文章配置转载规则

以下为文章的 Front-matter 示例。

最简示例

---
title: typora-vue-theme主题介绍
date: 2018-09-07 09:25:00
---

最全示例

---
title: typora-vue-theme主题介绍
date: 2018-09-07 09:25:00
author: 赵奇
img: /source/images/xxx.jpg
top: true
cover: true
coverImg: /images/1.jpg
password: 8d969eef6ecad3c29a3a629280e686cf0c3f5d5a86aff3ca12020c923adc6c92
toc: false
mathjax: false
summary: 这是你自定义的文章摘要内容，如果这个属性有值，文章卡片摘要就显示这段文字，否则程序会自动截取文章的部分内容作为摘要
categories: Markdown
tags:
  - Typora
  - Markdown
---

4. 效果截图

最新版本进行了优化更新，效果图与最初的效果图有差别，下面的图不是最新版本的。

首页推荐文章

首页文章列表

关于我页面

文章详细页面

5. 自定制修改

在本主题的 _config.yml 中可以修改部分自定义信息，有以下几个部分：

菜单
我的梦想
首页的音乐播放器和视频播放器配置
是否显示推荐文章名称和按钮配置
favicon 和 Logo
个人信息
TOC 目录
文章打赏信息
复制文章内容时追加版权信息
MathJax
文章字数统计、阅读时长
点击页面的’爱心’效果
我的项目
我的技能
我的相册
Gitalk、Gitment、Valine 和 disqus 评论配置
不蒜子统计和谷歌分析（Google Analytics）
默认特色图的集合。当文章没有设置特色图时，本主题会根据文章标题的 hashcode 值取余，来选择展示对应的特色图

我认为个人博客应该都有自己的风格和特色。如果本主题中的诸多功能和主题色彩你不满意，可以在主题中自定义修改，很多更自由的功能和细节点的修改难以在主题的 _config.yml 中完成，需要修改源代码才来完成。

6. 版本记录

版本更新记录

v2.0.0
- 新增了对 Hexo 5.0.0 的支持，并推荐升级使用 Hexo 5.0.0，去除了对 hexo-prism-plugin 插件的依赖，可直接使用自带的 prismjs 插件；
- 新增了背景图功能；
- 新增了畅言、腾讯兔小巢、哔哔、 Artitalk 等评论或说说功能；
- 开始阅读部分行为修改；
- 修改了 TOC 目录高度为自适应；
- 修复了搜索的相关问题；
- 其他小问题修改；
v1.3.2
- 新增了繁体字的支持；
- 新增了 404 页面；
- 其他小问题修改；
v1.3.1
- 新增了 kbd 样式；
- 修复了子目录部署时词云中链接有误的问题；
- 移除了 TOC 中的竖线；
- 修复了首页 icon 图标中的 tooltip 不显示的问题；
- 修复生成静态文件时，每天切换 banner 不生效的问题；
- 更新了 miniValine 中的一些配置；
v1.3.0
- 新增了支持子目录部署的功能（如：Gitee）；
- 新增了 MiniValine 评论系统；
- 新增了 jsdelivr 的支持；
- 修复了诸多发现的 bug；
v1.2.2
- 新增了自定义文章 keywords 的功能；
- 新增静态彩带点击切换的功能和配置；
- 将文章字数统计、彩带和站点运行时间等功能默认设置为 false；
- 修改了文章的 description 的 meta 属性优先读取文章的 summary 属性；
- 修改了文章标题的 HTML 标签，从 div 改成了 h1 标题；
- 修改了页脚年份显示不正确的问题；
- 去掉了站点运行时间中多余的 setTimeout 代码；
v1.2.1
- 新增了 TOC 的展开目录层级设置和滚动条功能，防止目录较多的时候目录溢出；
- 修改了首页的展示方式为以前的模式；
- 修复首页按钮没有边框的问题；
- 修复了音乐及吸底模式、视频、推荐文章等不激活时仍然生成首页卡片的问题；
- 修复 wordCount 插件未安装的问题，修改了部分配置；
- 修复音乐的 JSON 配置中有单引号的情况页面不显示的音乐的问题
- 修复标签云在Hexo4.0下链接失效的问题；
v1.2.0
- 新增了 DaoVoice、Tidio 的在线聊天功能；
- 新增了两级菜单的功能；
- 新增了打字效果的副标题；
- 新增了网页内容预加载的功能；
- 新增了首页 banner 是否每日切换的配置功能；
- 新增了显示 ICP 备案信息的功能，默认未开启；
- 新增了百度分析的配置；
- 新增了代码块的语言显示、一键复制、显示行号等功能；
- 新增了首页轮播图和推荐文章可自定义配置的功能；
- 新增了文章页面显示更新日期；
- 新增了转载规则的图标；
- 修改了分享的布局和显示方式；
- 升级更新了部分依赖库的版本；
- 其他细节修改和优化；
v1.1.0
- 新增了 emoji 的支持；
- 新增了站点运行时间统计及配置；
- 新增了留言板的功能,默认未开启；
- 新增了 Twitter、Facebook、知乎的社交链接；
- 更新了 Valine 的版本为最新版；
- 其他小细节的修改；
v1.0.4
- 新增了能为每篇文章都自定义转载规则的功能；
- 修复上一页、下一页的自定义 summary 不显示的问题；
- 修复了友情链接显示错位的问题，改为了瀑布流的布局方式；
- 其他小细节 bug 的修改；
v1.0.3
- 新增了TOC展开、收缩的按钮和相关配置，默认显示此按钮；
v1.0.2
- 升级了 Materialize 框架版本为1.0.0，重构和修改了升级过程中的部分文件或问题；
- 新增了首页封面的全屏轮播特效，可以将更重要的文章设置到首页轮播中；
- 修复首页第一个按钮是中文的问题
- 修复了 iPhone 上点击搜索输入获取焦点的问题；
- 修复了 iPhone 上输入框获取焦点后页面放大的问题；
- 修复一些文章或 UI 显示问题；
v1.0.1
- 调整 css、js 的文件请求路径在主题的_config.yml中配置，便于你更快捷的配置自己的 CDN；
- 新增代码是否折行为可配置，默认为折行；
- 默认激活 TOC 功能，并新增为某篇文章关闭 TOC 的 Front-matter 配置选项；
- 修复文章滚动时，高亮的目录选项不准确的问题；
- IOS下移除搜索框自动获得焦点属性，防止自动获得焦点后导致视图上移；
v1.0.0
- 新增了所有基础功能；

主题特性

1. 主题下载与安装

2. 主题配置

2.1 切换主题

2.2 新建标签 tags 页面

2.3 新建分类 categories 页面

2.4 新建关于我 about 页面

2.5 新建留言板 contact 页面 (可选)

2.6 新建友情链接 friends 页面 (可选)

2.7 菜单导航配置

2.7.1. 配置基本菜单导航的名称、路径url和图标icon.

2.7.2. 二级菜单配置方法

2.8 添加emoji表情支持（可选的）

2.9 代码高亮

2.10 搜索

2.11 中文链接转拼音（建议安装）

2.12 文章字数统计插件（建议安装）

2.13 添加 RSS 订阅支持（可选的）

2.14 添加 DaoVoice 在线聊天功能（可选的）

2.15 添加 Tidio 在线聊天功能（可选的）

2.16 修改页脚

2.17 添加中文繁简转换

2.18 修改社交链接

2.19 修改打赏的二维码图片

2.20 配置音乐播放器（可选的）

2.21 添加note

2.22添加button

3. 文章 Front-matter 介绍

Front-matter 选项详解

最简示例

最全示例

4. 效果截图

5. 自定制修改

6. 版本记录

Yafine