5.Hexo为页面标记标签和类别

ChoSeitaku

于 2024-04-13 15:47:05 发布

阅读量367

点赞数 5

分类专栏： Hexo个人博客搭建文章标签： git vscode json node.js html

本文链接：https://blog.csdn.net/CoderZzz6310/article/details/137717020

版权

13 篇文章 0 订阅

订阅专栏

Hexo的标签和类别基本上是可以在Hexo中将内容分组的两种方式
如果在网站上有一堆内容，有不同的博客文章
将博客文章分类为不同的类别会很有帮助
用特定的关键词为博客文章标记

如果可以同时分类和标记页面，会使网站用户更轻松地找到他们想要的页面类型
还可以提高网站的整体组织性

![[Pasted image 20240413144413.png]]

现在posts文件夹里有a，b，d，f四个文件，这些都可以代表网站上的博客帖子
如果想为每个博客添加标签，可以通过简单地创建一个数组来做到这一点
输入Tag1，Tag2和Tag3
将用Tag1，Tag2和Tag3来标记a文件
![[Pasted image 20240413153115.png]]

用Tag1来标记b文件
Tag2来标记d文件
Tag3来标记f文件

保存修改然后转到网站
![[Pasted image 20240413153232.png|775]]

因为正在使用的Hexo主题，Hexo能够识别哪些文件标记有哪些标签，并显示在页面中
因此可以用这些标记特定关键词给特定的博客文章
![[Pasted image 20240413153259.png]]

并且在页面有一个标签页面，并且有3个链接，这些链接到Hexo创建的特殊页面
所以除了能够使用不同的标签去标记内容之外，Hexo还会为每个标签生成特定的页面
![[Pasted image 20240413153312.png]]

如果点击Tag1链接，Hexo会打开另一个页面，这时的URL
![[Pasted image 20240413153327.png]]

localhost:4000/tags/Tag1，这时一个完全专用于Tag1的页面
作用是列出网站上所有有Tag1标记的内容
![[Pasted image 20240413153343.png]]

如果点击Tag2，情况是一样的

Hexo自动生成这样的标签页面
自己要做的事情就是标记自己的内容

Hexo会在幕后做大量工作以便组织网站和所有内容
要做的就是在frontmatter里添加标签

categories:
- [Cat1]
- [Cat2]
- [Cat3]

现在已经用了类别标记了这个页面，当刷新页面的时候
会看到a文件多出了类别的部分显示出来
![[Pasted image 20240413153432.png]]

有三个不同的类别
类别的作用就像标签一样
![[Pasted image 20240413153451.png]]

如果点击一个类别链接，Hexo会带到localhost:4000/categories/Cat1
![[Pasted image 20240413153509.png]]

就像标签页面一样，这页会显示所有被Cat1标记的页面
![[Pasted image 20240413153524.png]]

同时右边也会有一个categories页面，里边显示所有类别
如果用类别标记其他文件
如果给b文件标记上类别1，在类别1页面也会显示b文章
![[Pasted image 20240413153611.png]]
![[Pasted image 20240413153628.png]]

可以使类别更复杂，类别中可以创建子类别
如

- [Cat1, Cat1.1]

Cat1.1就是Cat1的子类别
![[Pasted image 20240413153654.png]]

刷新页面后会发现Cat1.1显示为类别
![[Pasted image 20240413153718.png]]

所以Cat1.1也会有自己的页面，里面只会显示a

如果点进Cat1页面，也会显示a
即使a被标记为Cat1.1，它也被标记为Cat1

这就是创建子类别的方式

可以通过这些方式认真优化和组织网站上的所有内容
如果使用一个不错的Hexo主题
默认的Hexo主题，它会自动为这些类别创建空间，让用户更加轻松地找到他们想要查找地内容
只要通过修改frontmatter就可以完成

关注