Hugo 创建基于目录的archetypes模板

创建基于目录的 archetypes 模板

在 Hugo 中可以使用完整的目录作为原型模板。

前言

如果不想将文章的图片杂乱地放在文章的同级目录下,可以创建一个 images 文件夹,将图片统一放在里面。但是每次都要手动创建,未免太麻烦,这时就可以通过 archetypes 设置一个基于目录的模板来简化这个操作。

本篇基于 Stack 主题。

创建目录结构

在 archetypes 目录下创建一个 default_structure 文件夹,文件名随意,目录结构如下:

1
2
3
4
5
6
archetypes
├── default.md
└── default_structure
    ├── images
    │   └── default.png
    └── index.md

default_structure 目录里的 index.md 也可以加上模板内容,比如:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
---
title: "{{ replace .Name "-" " " | title }}"
description: 
date: {{ .Date }}
image: images/default.png
hidden: false
comments: true
categories:["C++"]
tags:["C++"]
lastmod: {{ .Date }}
---

新建文章

模板创建好之后,就可以新建一篇文章看看效果了,使用命令:

1
hugo new --kind default_structure post/demo

该命令将创建一个新的文件夹 /content/posts/demo,并且它包含与 default_structure 原型文件夹中相同的文件夹结构。

注意:这里的 --kind 之后的参数需要与前面创建的目录结构的文件夹名相同,即 default_structure 目录名

此时就创建好文章了,可以看到 demo 目录的结构是符合预期的。

1
2
3
4
5
post
└── demo
    ├── images
    │   └── default.png
    └── index.md

同时,demo/index.md 的模板内容也成功添加

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
---
title: "Demo"
description: 
date: 2023-11-28T21:29:54+08:00
image: images/default.png
hidden: false
comments: true
categories: ["C++"]
tags: ["C++"]
lastmod: 2023-11-28T21:29:54+08:00
---

总结

通过合理设置 archetypes 原型模板,可以使得我们创建符合自身需求的文章目录结构。

当然,如果不喜欢 images 图片文件夹放在文章同级目录下,也可以考虑在 static 目录下创建 images 文件夹,这样在 md 文件中引用的时候也可以显示出来(如 ![](images/one.jpg))。