Вставки

Как уже говорилось можно импортировать части страницы с помощью тега include. Части страницы при использовании этого тега должны находится в диерктории _includes. Но также имеется возможность импортировать части относительно текущей директории, для этого используется тег include_relative. При такой вставке нельзя обращаться к родительской директории

Использование переменных при вставке

Во-первых можно импортировать по имени переменной. Это может быть удобно при разработке и подборке стиля.

---
title: My page
my_variable: footer_a.html
---

{% include {{ page.my_variable }} %}

Все файлы в директории _include имеют доступ к массиву include.

<div>
  <b>Note:</b> {{ include.note }}
</div>

Чтобы передать значения в массиве можно использовать переменные при вставке.

{% include note.html note="This is my sample note." %}

Так же в качестве содержимого переменной может выступать другая переменная.

{% include note.html note=site.data.some_data %}

Можно создать блок с помощью тега capture.

{% capture download_note %}
The latest version of {{ site.product_name }} is now available.
{% endcapture %}

{% include note.html note=download_note %}

Макеты

Как уже говорилось макеты в формате HTML лежат в директории _layouts. От вставки отличается тем, что импортируется не на страницу, а страница импортируется в макет. У каждой страницы, поста, или коллекции в Front Matter можно задать разметку в переменной layout.
Место, где содержимое будет вставляться в макет отображается в переменной {{content}}. Также в макете доступны все переменные и фильтры, что и в посте или на страницы. Чтобы указать родительский макет используется переменная layout в Front Matter.

---
layout: more-base
---
Этот макет будет вставляться в {{content}} more-base макета