标签:butterfly md hexo title series --- 添加 article post
文章目录
更多内容可参考我的博客
本篇文章基於 hexo + butterfly
当我们写一个系列文章的时候,想要在所属该系列的文章上方都展示一个类似于目录的结构,便于反复横跳整个系列。
废话不多说,直接开干!
新建两篇文章用来测试,由于是测试用的,通过hide属性隐藏不在首页展示。
新建test.md
// source\_posts\other\test.md
---
title: test
date: 2022-01-18 21:57:56
series: 测试二级目录
hide: true
tags:
- Tools
categories:
- Tools
---
## test
新建test1.md
// source\_posts\other\test1.md
---
title: test1
date: 2022-01-18 21:59:33
series: 测试二级目录
hide: true
tags:
- Tools
categories:
- Tools
---
## test1
{% tip warning faa-horizontal animated-hover %} ⚠️ 注意:关键点在于添加相同的series,以便于后期通过series遍历写入TOC {% endtip %}
不想每次手动添加series的,可以修改scaffolds\post.md,这样添加series后每次新建就自带series了
// scaffolds\post.md
---
title: {{ title }}
date: {{ date }}
series:
tags:
categories:
---
接下来,就是核心步骤,遍历展示目录结构
pug语法注意缩进!
// themes\Butterfly\layout\post.pug
extends includes/layout.pug
block content
#post
if top_img === false
include includes/header/post-info.pug
//- 添加二級目錄 start
if page.series
div.post-series
h3 #{page.series}-系列:
- let list = site.posts.sort('date', -1)
- list.each(function(article){
if article.series == page.series
- let link = article.link || article.path
- let title = article.title || _p('no_title')
li
a.title(href=url_for(link) title=title)= title
- })
//- 添加二級目錄 end
article#article-container.post-content!=page.content
验证效果,如下图:
初步完成,各位大佬可以自己改改样式…
标签:butterfly,md,hexo,title,series,---,添加,article,post
来源: https://blog.csdn.net/weixin_43404937/article/details/122584865
本站声明:
1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。