html - 无法访问自定义 Front Matter 变量

标签 html jekyll liquid kramdown yaml-front-matter

正在创建我的第一个 Jekyll(使用版本 4.0.0)支持的网站。问题是 Front Matter 中的变量无法识别。

_includes 中的 HTML(writing-post-featured-image.html)

<figure>
    <img class="feat-img" src="{{ site.baseurl }}/assets/images/{{ include.images }}" alt="{{ include.alt | default: 'lorem ipsum' }}" />
    <figcaption>{{ include.caption }}</figcaption>
</figure>

在_layout中具有基于文本的帖子页面的布局(writings-post.html)

{% include writing-post-featured-image.html image=post.featured-image alt=post.featured-image-alt %}

最后,在 .md 文件中(_posts 下)以下 Front Matter

layout: writings-post
title: my title
permalink: /writings/:title
featured-image: photo.jpg
featured-image-alt: about photo
caption: photo caption

输出为空

<figure>
    <img class="feat-img" src="" alt="lorem ipsum" />
    <figcaption></figcaption>
</figure>

请帮助理解为什么会这样。提前致谢。

最佳答案

您的语法不正确。

1.) 当您从页面传递变量时,您的包含标记应如下所示:

 {% include writing-post-featured-image.html 
    image=page.featured-image 
    alt=page.featured-image-alt 
    caption=page.caption %}

2.) 在您的包含中,您的 include.images 存在语法问题,应该是 include.image

注意:当您传递现有变量(不是计算变量)时,您可以跳过将它们传递到包含的过程,因为从包含中您可以看到页面的变量。

 {% include writing-post-featured-image.html %}

你的内容包括:

<figure>
    <img class="feat-img" 
         src="{{ site.baseurl }}/assets/images/{{ page.featured-image }}" 
         alt="{{ page.featured-image | default: 'lorem ipsum' }}" />
    <figcaption>{{ page.caption }}</figcaption>
</figure>

关于html - 无法访问自定义 Front Matter 变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58511885/

相关文章:

html - 应用程序设计 : Scala + HTML5

Android:将 AMP 格式的 HTML 加载到 WebView

php - 通过 php 检查复选框时隐藏 html

jekyll - 使用 Jekyll 和 GitHub 页面生成特定于类别的 RSS 提要

.net - 创建一个实现 ILiquidizable 的 DataRow 类

html - Servlet返回“HTTP状态404请求的资源(/Servlet)不可用”

jekyll - 我的所有帖子都在 Octopress 的/source/_posts 中,如何将它们部署到 Github 页面?

ruby - 解析 Jekyll 的类别

ruby - 有没有办法从 Jekyll 的 [site.time] 属性轻松解析年份?

shopify - Shopify 应用程序可以在商店主题内自动注入(inject)液体代码吗?