Hugo中自动生成的页面(Auto

Hugo中自动生成的页面(Auto-generated pages in Hugo)

是否有可能从Hugo的数据文件中自动生成页面，就像在Middleman中一样？ 我有一个yaml文件cars.yml ，它看起来像这样：

--- - name: "Ford" color: "blue" - name: "Cadillac" color: "pink"

并且希望基于预定义的模板为数据文件中的每个汽车记录自动生成单独的页面。 我怎样才能做到这一点？

Is it possible to auto-generate pages from a data file in Hugo, like in Middleman? I have a yaml file cars.yml which looks like this:

--- - name: "Ford" color: "blue" - name: "Cadillac" color: "pink"

and would like to auto-generate a separate page for each car record in the datafile based on a predefined template. How can I do that?

最满意答案

按照文档的说明 ，我通过以下步骤实现了MVP：

安装了一个测试雨果网站， hugo new site carsite 。 根文件夹已经有/data/文件夹，我在那里创建了cars子文件夹。 carsite/data/cars将每辆车作为单独的文件。 这与您最初将它们放在列表中的计划不同，但每个单车方法的单文件更好（版本控制，维护，更不容易出错，因为错误的.yml将被单独标记，而不是整体数据文件）。

在/data/文件夹中创建内容文件：

ford.yml ：

Name: "Ford" Color: "Blue"

和

cadillac.yml ：

Name: "Cadillac" Color: "Pink"

创建一个部分样式的汽车列表：

carsite/themes/<your theme name>/layouts/partials/car_listing.html

<li>{{ .Name }} in {{ .Color }}</li>

调用文件中的循环或Go术语范围数据文件，负责您选择的位置。 例如，让我们在主页上输出它，该主页由carsite/themes/<theme name>/layouts/index.html ：

...(existing header.html partial and so on)... <ul> {{ range $.Site.Data.cars }} {{ partial "car_listing.html" . }} {{ end }} </ul> ...(existing footer.html partial and so on)...

这是它在我的看法（ 代笔模板）：

---

如果你坚持在一个数据文件中存放所有文件 ，那也应该是可行的，只需查询数据文件并对其进行测距 。 此外，如果您选择yml格式，请设置数据文件的正确格式序列 （您建议的数据结构看起来很可疑，因为列表在根中是直的，而是添加一个键，例如，car cars:按照上述YML规范）：

carsite/data/cars.yml

cars: - Name: Ford Color: Blue - Name: Cadillac Color: Pink

Along the lines of the documentation, I achieved the MVP in the following steps:

Installed a test Hugo site, hugo new site carsite. Root folder already had /data/ folder, I created cars subfolder there. carsite/data/cars will hold each car as a separate file. This differs from your original plan to put them in a list, but one-file per one-car approach is better (version control, maintenance, less error-prone because erroneous .yml will be flagged separately, not monolithic data file).

Create content files inside /data/ folder:

ford.yml:

Name: "Ford" Color: "Blue"

and

cadillac.yml:

Name: "Cadillac" Color: "Pink"

Create a partial to style the car listing:

carsite/themes/<your theme name>/layouts/partials/car_listing.html

<li>{{ .Name }} in {{ .Color }}</li>

Call the loop, or in Go terminology, range data files in the file, responsible for your chosen location. For example, let's output it on the main homepage, which is controlled by carsite/themes/<theme name>/layouts/index.html:

...(existing header.html partial and so on)... <ul> {{ range $.Site.Data.cars }} {{ partial "car_listing.html" . }} {{ end }} </ul> ...(existing footer.html partial and so on)...

Here's how it looks on mine (ghostwriter template):

---

If you insist on housing all the files within one data file, that should be doable too, just query the data file and range it. Also, if you chose yml format, set the correct format sequence of your data file (your proposed data structure looks suspicious since the list is straight in the root, instead add a key, for example, cars: as per aforementioned YML spec):

carsite/data/cars.yml

cars: - Name: Ford Color: Blue - Name: Cadillac Color: Pink