如何使用Liquid列出目录中的文件? [英] How to list files in a directory with Liquid?

问题描述

我正在尝试学习如何将Jekyll与Bootstrap结合使用；在研究它们时，我决定要在主页上放置一个图像轮播.

I'm trying to learn how to use Jekyll along with Bootstrap; while studying them, I decided that I'd like to have an image carousel on my homepage.

由于我真的很懒，所以我不想硬编码在布局中显示每个图像所需的路径，而且我也不愿意使用数组来存储图像列表.

Since I'm really lazy I don't want to hard-code the paths needed to display every image inside the layout, and I wouldn't either prefer to use an array to store the list of images.

我想知道是否有任何标签可以要求Jekyll执行以下两个步骤:

I was wondering if there's any tag that could ask Jekyll to do these two steps:

1. 查看特定目录
2. 对于在该目录中找到的每个文件，重复一段代码

基本上，我想写的东西与这段(虚构的)代码有些相似:

Basically what I'd like to write is something that vaguely resemble this piece of (imaginary) code:

{% for file in directory %}
    <img src="{{ file.url }}" />
{% endfor %}

例如，如果我有一个包含三个文件的文件夹，分别名为image01.jpg，image02.jpg，image03.jpg，我希望jekyll可以为我构建此HTML代码:

So if, for example, I have a folder with three files named image01.jpg, image02.jpg, image03.jpg, I'd like that jekyll could build this HTML code for me:

<img src="folder/image01.jpg" />
<img src="folder/image02.jpg" />
<img src="folder/image03.jpg" />

所以我看了此参考页，但是我没有找不到任何对我有用的东西.

So I had a look at this reference page but I haven't found anything useful for my purpose.

请给我任何建议，如果可能的话，不涉及使用插件的建议?

Please, could you give me any suggestion, and if possible, one that doesn't involve the use of a plugin?

谢谢.

推荐答案

修改(2015-11-09): 此后，Jekyll得到了一些更新，尤其是site.static_pages.查看@raphael答案以寻求可能的解决方案.

edit (2015-11-09): Jekyll has since gotten some updates, especially site.static_pages. Check @raphael answer for a possible solution.

不使用插件是不可能的.您在Liquid Templates中没有I/O功能.

It is impossible without using a plugin. You do not have I/O capabilities inside Liquid Templates.

如果您的图片具有先决条件，则它们可能会被Jekyll处理并存储在site.pages数组中，因此可以访问，但我不建议您将Front Matter放在图片上(对于SVG可能有意义，但不建议这样做)其他).

If your images have front matter, they might get processed by Jekyll and be stored in the site.pages array and thus being accessible, but I wouldn't recommend placing Front Matter on images (might make sense for SVGs, but not for anything else).

您最好的选择是编写一个小的Shell脚本，该脚本会扫描您的文件夹中的图像并创建images.json文件.然后可以通过Ajax加载该文件.每次上载新文件时，只需重新创建images.json文件即可(如果使用的是Git，则可以将其作为预提交的钩子).

Your best bet is probably to write a little shell script that scans your folder for images and creates an images.json file. This file could then be loaded via Ajax. You'd just have to recreate your images.json file every time you upload a new file (if you are using Git, you could to that as a pre-commit hook).

这篇关于如何使用Liquid列出目录中的文件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！