I am trying to rebuild a blog in Jekyll and I have stubled upon a simple task.
Provided I have the following set of templates:
default.html:
If your use-case is like mine and you want to include add'l content inside your template, you can include multiline content from your front matter into the template using YAML's block scalar feature. A |
keeps line-breaks while a >
removes ("folds") line-breaks. (Note that the block indicator must be followed by a blank line.)
index.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? -->
default.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>
You can't do this with a capture, but you can using an include. Every level of the page hierarchy can override the head
key to point to a different include file as required. This example wraps the include with a condition so if no head
key is specified the page will still generate.
{% if page.head %}
{% include {{ page.head }} %}
{% endif %}
{{ content }}
---
layout: default
head: header1.html
---
{{ content }}
(Frontpage header content)