在Jekyll中为github页面动态添加和过滤图像？

Question

我正在尝试Jekyll来帮助不是所有技术人员的人维护自己的静态站点。 我希望能够在应用程序的根目录/images包含images目录，其中包含遵循命名约定的图像：

post_one_1.jpg, post_one_2.jpg, post_two_1.jpg, post_two_2.jpg ... etc.

然后，我希望用户创建一个帖子（post_one）并从images目录中动态获取与该帖子相关的所有图像。

这个插件（ https://gist.github.com/jgatjens/8925165 ）几乎可以满足我的需求，但是与github页面不兼容。

有没有一种解决方案，我可以将网站移交给用户，他们只需要按照命名约定将图像添加到图像目录中，然后创建帖子并可以访问图像？

Answer 1

鉴于您有一个帖子文件_posts / 2015-05-28-post_one.md

从这篇文章的内部，您有：

• page.id = / 2015/05/29 / post_one
• page.dir = / 2015/05/29

为了提取post_one whe做：

{% assign imgNameStart = page.id | remove: page.dir | remove: "/" %}

现在，我们生成搜索的基本路径：

{% assign imgBasePath = imgNameStart | prepend: "/images/" %}

在这种情况下，它将是imgBasePath =“ / images / post_one”

循环浏览我们所有的静态文件（不是页面或帖子的文件）。

{% for img in site.static_files %}

并打印路径中带有/ images / post_one的图像，例如/images/post_one-01.jpg或/images/post_one-wathever-you-want.jpg

{% if img.path contains imgBasePath %}
<img src="{{ site.baseurl }}{{ img.path }}">
{% endif %}
{% endfor %}

全部一起 ：

{% assign imgNameStart = page.id | remove: page.dir | remove: "/" %}
{% assign imgBasePath = imgNameStart | prepend: "/images/" %}
{% for img in site.static_files %}
{% if img.path contains imgBasePath %}
<img src="{{ site.baseurl }}{{ img.path }}">
{% endif %}
{% endfor %}

如果您的帖子是降价文件，请当心代码缩进，可以将四个空格缩进为代码段。