include
tag 允许您包含存储在 _includes
文件夹中的另一个文件中的内容:
{% include footer.html %}
Jekyll将在 source 目录根目录的 _includes
目录中查找被引用的文件(在本例中为 footer.html
),并插入其内容。
您可以使用 include_relative
tag 来选择包含相对于当前文件的文件片段:
{% include_relative somedir/footer.html %}
您不需要将包含的内容放在 _includes
目录中。相反,所包含的内容是专门相对于使用 tag 的文件的。例如,如果 _posts/2014-09-03-my-file.markdown
使用 include_relative
tag ,则包含的文件必须位于 _posts
目录或其子目录中。
请注意,您不能使用 ../
语法来指定引用更高级目录的 include 位置。
include
tag 的所有其他功能都可用于 include_relative
tag ,例如变量。
可以将要嵌入的文件名指定为变量,而不是实际的文件名。例如,假设您在页面的 front matter 中定义了一个变量,如下所示:
---
title: My page
my_variable: footer_company_a.html
---
然后,您可以在 include 中引用该变量:
{% if page.my_variable %}
{% include {{ page.my_variable }} %}
{% endif %}
在本例中,include 将插入 _includes/footer_company_a.html
目录中的 footer_company_a.html
文件。
您也可以将参数传递给 include 。例如,假设 _includes
文件夹中有一个名为 note.html
的文件,该文件包含以下格式:
Note:
{{ include.content }}
{{ include.content }}
是一个参数,当您调用 include 并为该参数指定值时,会填充该参数,如下所示:
{% include note.html content="This is my sample note." %}
content
的值(This is my sample note
)将插入到 {{ include.content }}
参数中。
当您想隐藏 Markdown 内容中的复杂格式时,将参数传递给 includes 尤其有用。
例如,假设您有一个具有复杂格式的特殊图像语法,并且您不希望作者记住复杂的格式。因此,您决定通过使用带参数的 include 来简化格式设置。以下是您可能希望使用 include 填充的特殊图像语法的示例:
<figure>
<a href="https://jekyllrb.com">
<img src="logo.png" style="max-width: 200px;"
alt="Jekyll logo" />
a>
<figcaption>This is the Jekyll logofigcaption>
figure>
您可以在 include 中模板化此内容,并将每个值作为参数使用,如下所示:
这个 include 包含 5 个参数:
url
max-width
file
alt
caption
下面是一个将所有参数传递给 include 的示例(include 文件名为 image.html
):
{% include image.html url="http://jekyllrb.com"
max-width="200px" file="logo.png" alt="Jekyll logo"
caption="This is the Jekyll logo." %}
这个的结果是之前显示的原始 HTML 代码。
为了保护用户不提供参数值的情况,可以参阅 Liquid’s default filter 。
总的来说,您可以创建 includes ,作为各种用途的模板——插入音频或视频片段、警报、特殊格式等等。请注意,您应该避免使用过多的 includes ,因为这会减慢网站的构建时间。例如,不要每次插入图像时都使用 includes 。(上面的技术显示了一个用于特殊图像的用例。)
假设要传递给 include 的参数是一个变量,而不是字符串。例如,您可能使用 {{ site.product_name }}
来引用产品的每个实例,而不是实际的硬编码名称。(在这种情况下,您的 _config.yml
文件将有一个名为 product_name
的密钥,其值为您的产品名称。)
传递给 include 参数的字符串不能包含大括号。例如,不能传递包含以下内容的参数:
"The latest version of {{ site.product_name }} is now available."
如果要将此变量包含在传递给 include 的参数中,则需要将整个参数存储为一个变量,然后再将其传递给 include 。您可以使用 capture
tags 来创建变量:
{% capture download_note %}
The latest version of {{ site.product_name }} is now available.
{% endcapture %}
然后将这个捕获的变量传递到 include 的参数中。省略参数内容周围的引号,因为它不再是字符串(它是一个变量):
{% include note.html content=download_note %}