20

我正在尝试在 Jekyll 中重建一个博客,但我偶然发现了一个简单的任务。

如果我有以下一组模板:

默认.html:

{{ head }}

{{ content }}

frontpage.html:

---
layout: default
---

{% capture head %}
  Frontpage
{% end %}

{{ content }}

索引.html:

---
layout: frontpage
---

Other stuff

我期待这{% capture head %}会将变量传递给布局。但似乎只有来自 Front Matter 的变量实际上被传递为page.variable_name.

有没有办法将capture-d var 传递给 Jekyll 中的布局?

猜猜我可以为它制作 2 种不同的布局frontpagenormal_page这将替换布局中的整个{{head}}{{content}}块。capture但这就像 html 的两倍,所以如果可能的话,我宁愿用它来解决它。

4

2 回答 2

9

您不能使用捕获来执行此操作,但可以使用包含。页面层次结构的每一级都可以根据head需要覆盖键以指向不同的包含文件。此示例使用条件包装包含,因此如果未head指定任何键,页面仍将生成。

默认.html

{% if page.head %}
  {% include {{ page.head }} %}
{% endif %}

{{ content }}

frontpage.html

---
layout: default
head: header1.html
---

{{ content }}

_includes/header1.html

(Frontpage header content)
于 2014-02-28T21:56:16.820 回答
6

如果您的用例和我的一样,并且您想在模板中包含 add'l 内容,您可以使用 YAML 的块标量功能将来自前端的多行内容包含到模板中。A|保留换行符,而 a>删除(“折叠”)换行符。(请注意,块指示符后面必须有一个空行。)

索引.html

---
layout: default
head: |
  <link href="//cdn-images.mailchimp.com/embedcode/classic-081711.css" rel="stylesheet" type="text/css">
  <style type="text/css">
    #mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
  </style>
script: |
  <script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script>
  <script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[3]='PHONE';ftypes[3]='phone';fnames[4]='ORG';ftypes[4]='text';fnames[5]='MMERGE5';ftypes[5]='text';}(jQuery));var $mcj = jQuery.noConflict(true);</script>
---
<!-- Content, maybe a MailChimp signup form? -->

默认.html

<!DOCTYPE html>
<html>
<head>
  <title>
    {{page.title}}
  </title>
  <link rel="stylesheet" type="text/css" href="/css/main.css">

  <!-- here you can have add'l arbitrary head content -->
  {{ page.head }}
</head>
<body>
  {{content}}

  <script>
    // Google Analytics, perhaps?
  </script>

  <!-- here you can have add'l arbitrary content at the end of the page, good for scripts -->
  {{page.script}}
</body>
</html>
于 2014-11-10T02:35:57.970 回答