博客标签和分类

Posted on | In |

本篇日志记录为 hexo 博客添加标签 tags 和分类功能 categories.
tags： 每篇日志可以有多个标签，就是关键词的意思，方便索引
categories：每篇日志可以按内容，属性去分类，书的目录一样，树形归类
archives：归档，按日期归档

0x0 hexo front-matter

说明文档

hexo 每篇Markdown文档头部使用 front-matter 块来描述文章的标题，发布日期，标签，分类等元信息,支持 yaml 格式：如本文的

---
title: 博客标签和分类
date: 2018-08-12 11:45:24
tags: [hexo, blog]
categories: [blog]
---

其中 tags 和 categories 字段就是描述标签和分类的，两个字段的值用数组的形式表达。

0x1 hexo page

我们使用 hexo new “title” 创建新日志，默认是创建在 sourece/_post 下，是普通日志
为了显示标签列表页和分类列表页，得创建单独的页面， 在 hexo 里，使用

hexo new page "page_name"

来创建，创建 sourece/page_name 目录

  1. 创建 tags 页面

    hexo new page "tags"

    并编辑 sourece/tags/index.html 的 front-matter，指定 type，其中 comments: false 表示此页不显示评论区

    ---
title: All tags
date: 2018-08-12 11:30:36
type: "tags"
comments: false
---

  2. 创建 categories 页面

    hexo new page "categories"

    并编辑 sourece/categories/index.html 的 front-matter

    ---
title: categories
date: 2018-08-12 11:37:55
type: "categories"
comments: false
---

    现在我们重新生成站点，部署后，我们可以在 https://chenjiancan.github.io/tags/ 页面下看到标签， https://chenjiancan.github.io/categories 下看到分类列表。
    但是我们的首页还没有入口可以进入。

0x2 配置主题菜单

我们的页面样式是依赖主题的，比如我是用 next 主题，就需要在 nex 主题的 _config.yaml 配置页面菜单页菜单项对应的 url

  1. _config.yaml 

    menu:
    home: / || home
    about: /about/ || user
    tags: /tags/ || tags
    categories: /categories/ || th
    archives: /archives/ || archive
    # #schedule: /schedule/ || calendar
    # #sitemap: /sitemap.xml || sitemap
    # #commonweal: /404/ || heartbeat

    看看效果，菜单的效果，可以看出， menu 下每个字段对应菜单的一个入口，值便是入口地址的相对 url。

    Note: || 后面的字符串表示的是 icon 的名字

  2. tags page 效果

是标签云的样子

  1. categories page 效果
    是目录的样子

0x3 增加 about 页面

同样的方式，about 是一个页面

hexo new page "about"

这么简单就创建了 about 页面了，前面我已经在主题的 _config.yaml 里配置 about 了