hexo-分类&标签应用

指令解析

1
2
3

# 根据scaffolds模板下的page文件创建相应的分类或者标签概念
hexo new page xxx
# 该指令执行完成会在source下相应生成一个xxx文件夹（内有一个index.md文件）

1.分类&标签创建

分类创建

创建分类页面

1 2	# 执行命令创建分类 hexo new page categories

构建完成：categories/index.md对应内容

1 2	title: categories date: xxxx-xx-xx xx:xx:xx

修改index.md文件，将页面类型设置为 categories ，主题将自动为这个页面显示所有分类（可根据自身需求配置相关内容）

1
2
3

title: categories
date: xxxx-xx-xx xx:xx:xx
type: "categories"

标签创建

创建标签页面

1 2	# 执行命令创建标签 hexo new page tags

构建完成：tags/index.md对应内容

1 2	title: tags date: xxxx-xx-xx xx:xx:xx

改index.md文件，将页面类型设置为 tags，主题将自动为这个页面显示所有标签（可根据自身需求配置相关内容）

1
2
3

title: tags
date: xxxx-xx-xx xx:xx:xx
type: "tags"

2.分类&标签应用

基础应用

_config.butterfly.yml主题配置文件菜单对应

1
2
3

menu:
		标签: /tags/ || fas fa-tags
    分类: /categories/ || fas fa-folder-open

配置完成，则可通过导航栏访问到相应的页面

在文章中配置分类和标签

创建一个文章，编辑front-matter，设定相应的分类和标签信息，注意区分分类、标签的层次关系

只有文章支持分类和标签，可以在 Front-matter 中设置。在其他系统中，分类和标签听起来很接近，但是在 Hexo 中两者有着明显的差别：分类具有顺序性和层次性；而标签没有顺序和层次。

title: 个人博客
categories:
  - java-note
  - base
comments: true
tags: 
	- java
	- database
keywords: 'java,database'
abbrlink: b5ea4f7a # 自动生成的永久链接（一般不作改动）
date: xxx-xx-xx xx:xx:xx
updated: xxx-xx-xx xx:xx:xx

预览文章内容，显示信息：

多级分类构建

多级分类构建

categories:
	- [java-note, base]
	- [java-note, database]
	- [vue-note]
# 上述分类为：java-note下有base、database两个子分类，而vue-note没有子分类

渲染出的博客信息为下图所示，这篇文章对应包括三个分类分别为base、database、vue-note

对应分类展示如下所示：

此处需要注意的是，通过typora直接编辑的文章内容虽然制定了分类、标签信息，通过hexo g生成后可以在文章中直接访问，但是却没办法通过导航栏进行访问，主要是渲染时并没有检测到对应的页面，因此需要手动通过指令生成页面信息

自定义菜单布局

_config.butterfly.yml主题配置文件菜单对应

# 根据日常编辑习惯和内容调整导航栏信息
menu:
    首页: / || fas fa-home
    导航||fab fa-bandcamp:
        文章: /archives/ || fas fa-archive
        分类: /categories/ || fas fa-folder-open
        标签: /tags/ || fas fa-tags
        
    开发||fas fa-home:
        JAVA开发: /java-note/ || fas fa-archive
        框架: /framework-note/ || fas fa-folder-open
        数据库: /database-note/ || fas fa-tags
        前端开发: /front-end-dev-note/ || fas fa-tags
    
    网站||fas fa-home:
        在线工具: /tools/ || fas fa-archive
        友情链接: /link/ || fas fa-link
        
    关于||fas fa-home:
        日常向: /daily/ || fas fa-archive
        娱乐向: /entertainment/ || fas fa-folder-open
        关于: /about/ || fas fa-heart