页面资源
页面资源只能从页面包访问，这些目录的根目录中包含 index.md 或 _index.md 文件。页面资源仅适用于与其绑定的页面。
在此示例中，first-post 是一个页面包，可以访问 10 个页面资源，包括音频、数据、文档、图像和视频。虽然 second-post 也是一个页面包，但它没有页面资源，也无法直接访问与 first-post 关联的页面资源。
content
└── post
├── first-post
│ ├── images
│ │ ├── a.jpg
│ │ ├── b.jpg
│ │ └── c.jpg
│ ├── index.md (root of page bundle)
│ ├── latest.html
│ ├── manual.json
│ ├── notice.md
│ ├── office.mp3
│ ├── pocket.mp4
│ ├── rating.pdf
│ └── safety.txt
└── second-post
└── index.md (root of page bundle)
示例
在 Page 对象上使用以下任何方法来捕获页面资源
捕获资源后，使用任何适用的Resource方法来返回值或执行操作。
以下示例假设有此内容结构
content/
└── example/
├── data/
│ └── books.json <-- page resource
├── images/
│ ├── a.jpg <-- page resource
│ └── b.jpg <-- page resource
├── snippets/
│ └── text.md <-- page resource
└── index.md
渲染单个图像，如果文件不存在则抛出错误
{{ $path := "images/a.jpg" }}
{{ with .Resources.Get $path }}
<img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="">
{{ else }}
{{ errorf "Unable to get page resource %q" $path }}
{{ end }}
渲染所有图像，调整大小为 300 像素宽
{{ range .Resources.ByType "image" }}
{{ with .Resize "300x" }}
<img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="">
{{ end }}
{{ end }}
渲染 markdown 代码段
{{ with .Resources.Get "snippets/text.md" }}
{{ .Content }}
{{ end }}
列出数据文件中的标题，如果文件不存在则抛出错误。
{{ $path := "data/books.json" }}
{{ with .Resources.Get $path }}
{{ with . | transform.Unmarshal }}
<p>Books:</p>
<ul>
{{ range . }}
<li>{{ .title }}</li>
{{ end }}
</ul>
{{ end }}
{{ else }}
{{ errorf "Unable to get page resource %q" $path }}
{{ end }}
元数据
页面资源的元数据通过相应的页面的前言进行管理，使用名为 resources 的数组/表参数。您可以使用通配符批量分配值。
- name
- (
string) 设置Name中返回的值。
- title
- (
string) 设置Title中返回的值 - params
- (
map) 自定义键值对的映射。
资源元数据示例
content/example.md
---
date: "2018-01-25"
resources:
- name: header
src: images/sunset.jpg
- params:
icon: photo
src: documents/photo_specs.pdf
title: Photo Specifications
- src: documents/guide.pdf
title: Instruction Guide
- src: documents/checklist.pdf
title: Document Checklist
- src: documents/payment.docx
title: Proof of Payment
- name: pdf-file-:counter
params:
icon: pdf
src: '**.pdf'
- params:
icon: word
src: '**.docx'
title: Application
---+++
date = '2018-01-25'
title = 'Application'
[[resources]]
name = 'header'
src = 'images/sunset.jpg'
[[resources]]
src = 'documents/photo_specs.pdf'
title = 'Photo Specifications'
[resources.params]
icon = 'photo'
[[resources]]
src = 'documents/guide.pdf'
title = 'Instruction Guide'
[[resources]]
src = 'documents/checklist.pdf'
title = 'Document Checklist'
[[resources]]
src = 'documents/payment.docx'
title = 'Proof of Payment'
[[resources]]
name = 'pdf-file-:counter'
src = '**.pdf'
[resources.params]
icon = 'pdf'
[[resources]]
src = '**.docx'
[resources.params]
icon = 'word'
+++{
"date": "2018-01-25",
"resources": [
{
"name": "header",
"src": "images/sunset.jpg"
},
{
"params": {
"icon": "photo"
},
"src": "documents/photo_specs.pdf",
"title": "Photo Specifications"
},
{
"src": "documents/guide.pdf",
"title": "Instruction Guide"
},
{
"src": "documents/checklist.pdf",
"title": "Document Checklist"
},
{
"src": "documents/payment.docx",
"title": "Proof of Payment"
},
{
"name": "pdf-file-:counter",
"params": {
"icon": "pdf"
},
"src": "**.pdf"
},
{
"params": {
"icon": "word"
},
"src": "**.docx"
}
],
"title": "Application"
}
从上面的示例中
sunset.jpg将收到一个新的Name，现在可以使用.GetMatch "header"找到它。documents/photo_specs.pdf将获取photo图标。documents/checklist.pdf、documents/guide.pdf和documents/payment.docx将获取由title设置的Title。- 除了
documents/photo_specs.pdf之外，捆绑包中的每个PDF都将获得pdf图标。 - 所有
PDF文件都将获得一个新的Name。name参数包含一个特殊的占位符:counter，因此Name将为pdf-file-1、pdf-file-2、pdf-file-3。 - 捆绑包中的每个 docx 都将收到
word图标。
name 和 title 中的 :counter 占位符
:counter 是 name 和 title 参数 resources 中识别的特殊占位符。
计数器在首次在 name 或 title 中使用时从 1 开始。
例如，如果一个捆绑包具有资源 photo_specs.pdf、other_specs.pdf、guide.pdf 和 checklist.pdf，并且前言已将 resources 指定为
content/inspections/engine/index.md
---
resources:
- src: '*specs.pdf'
title: 'Specification #:counter'
- name: pdf-file-:counter
src: '**.pdf'
title: Engine inspections
---+++
title = 'Engine inspections'
[[resources]]
src = '*specs.pdf'
title = 'Specification #:counter'
[[resources]]
name = 'pdf-file-:counter'
src = '**.pdf'
+++{
"resources": [
{
"src": "*specs.pdf",
"title": "Specification #:counter"
},
{
"name": "pdf-file-:counter",
"src": "**.pdf"
}
],
"title": "Engine inspections"
}
Name 和 Title 将按如下方式分配给资源文件
| 资源文件 | Name |
Title |
|---|---|---|
| checklist.pdf | "pdf-file-1.pdf |
"checklist.pdf" |
| guide.pdf | "pdf-file-2.pdf |
"guide.pdf" |
| other_specs.pdf | "pdf-file-3.pdf |
"规范 #1" |
| photo_specs.pdf | "pdf-file-4.pdf |
“规范 #2” |
多语言
v0.123.0 版本新增默认情况下，对于多语言单主机站点，Hugo 在构建站点时不会复制共享页面资源。
考虑以下站点配置
hugo.
defaultContentLanguage: de
defaultContentLanguageInSubdir: true
languages:
de:
languageCode: de-DE
languageName: Deutsch
weight: 1
en:
languageCode: en-US
languageName: English
weight: 2
defaultContentLanguage = 'de'
defaultContentLanguageInSubdir = true
[languages]
[languages.de]
languageCode = 'de-DE'
languageName = 'Deutsch'
weight = 1
[languages.en]
languageCode = 'en-US'
languageName = 'English'
weight = 2
{
"defaultContentLanguage": "de",
"defaultContentLanguageInSubdir": true,
"languages": {
"de": {
"languageCode": "de-DE",
"languageName": "Deutsch",
"weight": 1
},
"en": {
"languageCode": "en-US",
"languageName": "English",
"weight": 2
}
}
}
以及以下内容
content/
└── my-bundle/
├── a.jpg <-- shared page resource
├── b.jpg <-- shared page resource
├── c.de.jpg
├── c.en.jpg
├── index.de.md
└── index.en.md
在 v0.122.0 及更早版本中，Hugo 会复制共享页面资源，为每种语言创建副本
public/
├── de/
│ ├── my-bundle/
│ │ ├── a.jpg <-- shared page resource
│ │ ├── b.jpg <-- shared page resource
│ │ ├── c.de.jpg
│ │ └── index.html
│ └── index.html
├── en/
│ ├── my-bundle/
│ │ ├── a.jpg <-- shared page resource (duplicate)
│ │ ├── b.jpg <-- shared page resource (duplicate)
│ │ ├── c.en.jpg
│ │ └── index.html
│ └── index.html
└── index.html
在 v0.123.0 及更高版本中，Hugo 将共享资源放置在默认内容语言的页面包中
public/
├── de/
│ ├── my-bundle/
│ │ ├── a.jpg <-- shared page resource
│ │ ├── b.jpg <-- shared page resource
│ │ ├── c.de.jpg
│ │ └── index.html
│ └── index.html
├── en/
│ ├── my-bundle/
│ │ ├── c.en.jpg
│ │ └── index.html
│ └── index.html
└── index.html
这种方法可以减少构建时间、存储需求、带宽消耗和部署时间，最终降低成本。
尽管复制共享页面资源效率低下，但如果需要，您可以在站点配置中启用此功能
hugo.
markup:
goldmark:
duplicateResourceFiles: true
[markup]
[markup.goldmark]
duplicateResourceFiles = true
{
"markup": {
"goldmark": {
"duplicateResourceFiles": true
}
}
}