Когда на сайте появляется достаточно количество статей, то их, возможно, потребуется каким-то образом группировать, отображать в определенном порядке и прочее. Одним из способов подобной группировки постов является назначение статьям категорий и выделение ключевых слов.
Как Jekyll видит категории?
Сразу из коробки нам доступна переменная site.categories
. В этой переменной хранится массив всех категорий и соответствующих им статей. Однако, переменная доступна, но она будет пуста до тех пор, пока мы не определим хотя бы одну статью в категорию. Чтобы затем использовать эту переменную в html, обращаться к ней надо по-привычному через {{site.categories}}
. Обращаю внимание, что переменная будет содержать массив примерно следующего содержания: {"cat1"=>[#,#,#], "cat2"=>[#,#],...}
, где cat1
- это название категории, а далее в квадратных скобках обозначение статей данной категории. Это информация пригодится чуть дальше.
Назначение категорий статьям
Чтобы присвоить или определить статью под какую-либо категорию, достаточно в YAML шапке данной статьи указать category
:
title: Some Title
date: 2016-08-01 14:22
category: MyCategory
Если статья относится сразу к несольким категориям, то логично указать их массивом:
title: Some Title
date: 2016-08-01 14:22
category: [MyCategory1, AnotherCat, SomethingCat]
После добавления последнего варианта, например, переменная site.categories
будет содержать 3 объекта с разными названиями и одинаковыми ссылками на одну и ту же статью.
Теперь осталось добавить немного кода для вывода списка категорий.
Отображение списка статей по категориям
Данные, содержащиеся в переменной site.categories
, как нетрудно догадаться, недоступны для стороннего пользователя да и в целом неудобочитаема та информация. Поэтому её необходимо должным образом обработать и представить в более приемлемом формате, интегрировав в html.
Поскольку переменная по большому счету представляет из себя массив в массиве (список всех категорий, каждая из которых содержит список статей), то напрашивается обработать её вложенным циклом. Отображать результат я бы предпочел на отдельно созданной странице, доступной впоследствии из меню под ссылкой “все категории сайта”, например.
Опустим момент как добавить эту страницу, про это уже был разговор, а просто изложим требуемое содержимое:
<!-- categories.html -->
---
layout: default
title: Категории
permalink: /categories/
---
<h3>Список всех статей по доступным категориям.</h3>
{% for postscat in site.categories %}
{% assign cat = postscat | first %}
<h4 id="{{ cat | slugify }}"> - {{ cat }}</h4>
<ul>
{% for post in site.categories.[cat] %}
<li>
{{post.date | date: "%d-%m-%Y"}}
<a href="{{post.url}}">{{post.title}}</a>
</li>
{% endfor %}
</ul>
{% endfor %}
Процесс примерно следующий. Осуществляется перебор по объектам переменной site.categories
. Поскольку каждый выбранный объект представляется в виде "catname"=>[#,#,#]
и для дальнейшего использования сейчас мне нужно только название категории, то далее определим нужную переменную для внутреннего использования: {% assign cat = postscat | first %}
. Таким образом в переменной cat
теперь храниться название категории, которое чуть ниже выводиться в виде подзаголовка. Ну и далее организуется еще один цикл с перебором по всем статьям данной категории. Выходные данные представлены в виде списка названий статьей со ссылками на их собственные страницы.
Итог
Аналогичным образом можно работать и с тэгами. В этом случае просто поменяется название переменной на site.tags
, а весь алгоритм останется прежним.