我正在尝试在我的帖子列表中显示图片。
为了实现这一点,我在我的 post.md 中添加了一些标签:
---
title: "Hello"
header_image: /images/blog/2019/water.jpg
images: /images/blog/2019/water.jpg
resources:
src: /images/blog/2019/water.jpg
title: "The image I want"
---
然后我编辑了 list.html 并尝试了不同的东西:
{{ define "main" }}
<div class="archive animated fadeInDown">
<ul class="list-with-title">
<div class="listing-title">{{.Title}}</div>
{{ range .Pages }}
<ul class="listing">
<div class="listing-item">
<div class="listing-post"><a href="{{ .Permalink }}" title="{{ .Title }}">{{ .Title }}</a>
{{ with .Resources.ByType "image" }}
<div class="Image">
{{ range . }}
<img src="{{ .RelPermalink }}">
{{ end }}
</div>
{{ end }}
{{ $.Param "header_image" }}
-- {{ range .Page.Resources }}
THERE IS ONE ITEM => NOT WORKING
{{ end }} <<
<div class="post-time"><span class="date">{{.Date.Format "Jan 2" }}</span></div>
</div>
</div>
</ul>
{{ end }}
</div>
{{ end }}
但是当我尝试显示资源时,我总是得到 [](没有)
知道我做错了什么吗?
最佳答案
我认为您的 {{ $.Param "header_image"}}
也不工作。
在页面和站点上访问自定义的非标准变量的方法是通过 .Params
对象,例如.Params.header_image
。请注意开头的小写字母,而不是内置参数的大写字母。
Page-level params on the Hugo Docs
访问
---
header_image: /images/blog/2019/water.jpg
---
您可以在您的页面模板中使用它。
{{ .Params.header_image }}
看起来 resources
实际上是一个对象数组,使用 yaml
,你实际上应该有这样的东西(注意破折号):
resources:
- src: /images/blog/2019/water.jpg
title: "The image I want"
另请注意,此功能似乎仅适用于页面包
关于image - Hugo:如何在我的帖子列表中显示图片,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62135931/
我想在我的博客主页上添加一张 map 。它需要接受一些参数。我正在努力弄清楚如何正确配置它。我通过对设置进行硬编码来让它工作,但这并不适合与其他人分享我的解决方案。 我的问题是我将它实现为部分:{{
我正在为一位设计师在 Hugo 中构建一个网站。它包括一个投资组合,每篇文章中都有图片。 我认为最简单的管理方法是使用页面包。也就是说,在每个帖子的文件夹中包含图像,并让 Hugo 自动将该页面包中的
如何注释掉 Hugo 中的内容? 如果我有笔记,未完成的想法,我想把它们留在.md文件但没有它们出现在 html 中.