Jekyll:在另一个 post 中包含一个 post

Jekyll: including a post inside another post

Jekyll 是否提供了一种将 post 包含在另一个 post 中的方法?我知道这听起来有点傻,但我将它用于 cooking/recipe 站点。我的一些食谱是由组件或其他较小的食谱组成的。

我正在寻找一种方法,将少量 post 包含在 另一个 post 中,包括模板和所有内容。这可能吗?

我进行了大量的谷歌搜索,发现我只能包含到页面中,而不是 post,而且它没有使用默认的 liquid 模板,只是简单的 markdown。

想法?

我在我的网站上使用了 Jekyll 的 Collections 来解决与您的问题类似的问题。

Collections 仍然是 Jekyll 中的一个实验性功能,我使用的解决方案本身就很老套,但如果你不太喜欢它,它就足够了。

有关 collection 的更详细和友好的介绍,here's a great post about getting started with them

我们需要记住的一件事是,对于这种情况,我们应该远离 posts。

正如 Ben Balter 在上面 link 中提到的,“如果人们使用博客 post 来做 non-blog post 事情, Jekyll 已经失败了”食谱不是posts,我们应该尽可能避免使用它们。

话虽如此,我的方法分为三个步骤:

  1. 创建两个 collection(我们的自定义 post 类型)——假设它们是“食谱”和“成分”

  2. 找到一种方法将它们相互联系起来——确保“生菜”列在“沙拉”下面

  3. 在你的“食谱”中包含相关的“成分”——添加液体代码以在“沙拉”页面的某处实际显示来自“生菜”的信息。


步骤 1

为您的每个 collection 创建 _ingredients_recipes 文件夹(确保以复数命名)并将它们添加到您的 _config.yml 文件:

    collections:
      ingredients:
        output: true 
      recipes: 
        output: true  
        permalink: /recipes/:path/  

output: true 参数为 collection 中的每个项目创建一个单独的 HTML 页面,并且 permalink(可选)允许您控制 URL。


步骤 2

将这样的元数据添加到您的 lettuce.md collection 项目的 YAML front-matter:

    ---        
    parent-collection: salad
    ---

如果lettuce.md属于多个食谱,您可以添加多个。如果需要描述,请确保在元数据下方添加内容:

    ---
    parent-collection: 
     - salad
     - hamburguer
     - taco
    ---

    Lettuce is really good for your health, but it kinda sucks as a food.

请注意,saladhamburguertaco 的命名应与食谱 URL slug 完全相同,否则这将不起作用(即 greatrecipes.com/recipes/salad)。如果您的食谱名称是一个句子,请将其用引号引起来。

此变量稍后会被 slugified,因此像 parent-collection: The Amazing Souflè Français 这样的名称将匹配 the-amazing-soufle-francais。尽管如此,奇怪的事情还是发生了:当有疑问时,就写小写 salad

这是 hacky 部分。


步骤 3

为您的食谱创建一个特定的布局(如 _layout/recipe-page.html)并添加下面的代码 — 这是我们将成分添加到食谱页面的地方。

记住你的食谱(salad.md 和朋友)应该指向这个布局。

    {% capture current_collection %}{{ page.url | remove: "recipes" | remove: "/" | remove: " " }}{% endcapture %}

这里我们从 URL 中获取菜谱名称并将其分配给 current_collection 变量。确保它在一行中,因为使它 multi-line 会在捕获的字符串中添加一堆空格并破坏您的代码 10/10 次。 Insane .

    <div class="recipe-content">
    <p>{{ content }}</p> -- This is the content of the current recipe in the collection, your "post text".
    </div>


    {% for ingredient in site.ingredients %}

    {% capture captured_parent_collection %}{{ ingredient.parent-collection | slugify }}{% endcapture %} -- This capture is just to pass the slugify filter and sanitize parent.collection to make sure it matches the URL slug   

      {% if captured_parent_collection == current_collection %}
        <div class="recipe-ingredient">
          <h3>{{ ingredient.name }}</h3> -- "<h3>Lettuce</h3>"
          <p>{{ ingredient.content }}</p> -- "<p>Lettuce is really good for your health, but it kinda sucks as a food.</p>"
        </div>
      {% endif %}
    {% endfor %}

匹配此食谱的成分并将它们中的每一种都包含到布局中。哎呀!

您的每一种配料都应该出现在您的食谱文字下方。

请注意,您并没有像您在问题中描述的那样将成分 放入 食谱文本中,而是将它们包含在其后面的布局中。据我所知,您不能真正在 post/collection 文本的中间 添加内容 - 除非您通过 Jekyll 的自定义插件破解。


当然有更少的 hacky 方法可以做到这一点,但这就是我让它工作的方式。如果您自己和其他任何人在尝试此操作时遇到任何问题,请告诉我,请随时纠正我。

我在我的网站上进行了此设置 — 自己看看 the layout where I pull in my child collection items and the metadata on the child collection items

我在寻找解决此问题的方法时偶然发现了这个问题,这就是我最终所做的。我想我会 post 它以防其他人正在寻找一种方法来一次性完成此操作并且不想创建整个集合。

在 post 中您想包含其他 post 的地方,您可以使用 Jekyll 的 where 过滤器来获取对其他 post 的引用,然后打印 post 的内容:

---
layout: whatever
---

Your original post's content here.

{% assign myOtherPost = site.posts | where:"url", "/other/post/url" | first %}

{{ myOtherPost.content }}

Some more content here.