杰基尔 YAML 画廊

Question

我有一个页面以网格布局显示我的项目，这些项目是从 yaml 文件中提取的。我不知道如何为各个页面提取正确的数据。

Yaml 文件 (portfolio.yaml) 的格式如下：

- name: gallery one
  url: "/portfolio/gallery-one.html"
  thumbnail: /images/thumbnail.png
  decription: "Lorem ipsum dolor sit amet, consectetur adipisicing elit." 
- name: gallery two
  url: "/portfolio/gallery-one.html"
  thumbnail: /images/thumbnail.png
  decription: "Lorem ipsum dolor sit amet, consectetur adipisicing elit."

网格代码（工作正常）

{% for project in site.data.portfolio %}
      {{ project.url }}
      {{ project.thumbnail }}
 {% endfor %}

Answer 1

您的数据文件配置并不容易。像这样重新组织您的文件：

gallery one:
  url: "/portfolio/gallery-one.html"
  thumbnail: /images/thumbnail.png
  decription: "Lorem ipsum dolor sit amet, consectetur adipisicing elit."

gallery two:
  url: "/portfolio/gallery-one.html"
  thumbnail: /images/thumbnail.png
  decription: "Lorem ipsum dolor sit amet, consectetur adipisicing elit."

然后您可以制作一个将被所有项目页面使用的布局：

_layouts/portfolio.html

---
layout: default
---
{% assign project = site.data.portfolio[page.project] %}
<h1>{{ page.title }}</h1>
<p>{{ project.decription }}</p>
{{ content }}

然后项目页面如下所示：

图库-one.html

---
layout: portfolio
title: Gallery one
project: gallery one
---
additional content can go here

如果你有很多项目你可以看看jekyll collections可以自动生成页面。

杰基尔 YAML 画廊

Jekyll YAML gallery

grid

yaml

jekyll