Jekyll的画廊通过YAML标题列表



在https://stackoverflow.com/a/9857308/2966190我在杰基尔实现了一个简单的照片库。

_layouts/photos.html:

---
layout: layout
---
<section class="content">
<h1>
<a href="{{ page.url }}">{{ page.title }}</a>
</h1>
<section class="byline">
{{ page.date | date: "%B %e, %Y" }}
</section>
{% for pic in page.photos %}
<a href="{{ pic.url }}"><img src="{{ pic.url }}" alt="{{ pic.alt }}" /></a>
{% if pic.caption %}<p>{{ pic.caption }}</p>{% endif %}
{% endfor%}
{{ content }}
</section>

这样我就可以简单地列出所有需要的信息,并以这样的方式自动生成图库:

example_gallery.md:

---
layout: photos
title: SOME TITLE
photos:
- url:     /path/to/img1.png
alt:     alt1
caption: Caption with [hyperlinks](example.com) formatted [three][ways] [that][fail]
[fail]: failure.com/sadface
- url:     /path/to/img2.png
alt:     alt2.
caption: Caption with <a href="/explicit/html/tags.html"> that work but hurt the eyes, are annoying to write, and don't allow me to separate formatting from content</a>.
---
[ways]: doesntwork.com    

我遇到了与img1标题中格式相同的链接错误。

读取文件/path/to/example_gallery.md:()时出错:在分析第7行第4列的块映射时未找到所需的密钥

如果我将[link]的定义与caption:放在同一行(没有换行符),它也会失败。

在上面的链接示例中,作者明确提到在标题中不能使用markdown。为了解决这个问题,我尝试在布局photos.html中将{{ pic.caption }}更改为{{ pic.caption | markdownify }},但没有成功。

所以,我的问题是:有没有一种方法可以通过编辑每张照片的布局或YAML来让markdown在图像标题中发挥作用(即,不需要像"如何为Jekyll构建图库标签"中那样编写插件?)?摘录中似乎也有类似的内容(例如:请参阅:在YAML变量中包含jekyll/liquid模板数据?[我不需要liquid标签来在标题中工作,如答案中所讨论的])。

顺便说一句,caption有可能有换行符吗?

有很多问题,所以我将尝试逐一解决。

在YAML前端事务中包含链接的唯一方法是[hyperlinks](example.com)格式。这只是由于杰基尔渲染页面的顺序。

我使用了您的示例代码,并将标题的呈现方式更改为包括markdownify过滤器,它按预期工作(在从标题中删除第二行之后)。

{% if pic.caption %}<p>{{ pic.caption | markdownify }}</p>{% endif %}

标题中可以有换行符。如果您确实希望它们保留在输出中,请使用:

caption: | 
Caption with [hyperlinks](example.com).
Line break preserved
And another

请注意每行之间的额外换行符,以及每行文本开头的两个空格。如果不希望在输出中使用换行符,请使用">"字符而不是"|"。

所有这些都使用Jekyll中的kramdown markdown解析器进行了测试。

最新更新