# Установка Jekyll
gem install bundler jekyll
jekyll new my-awesome-site
cd my-awesome-site
bundle exec jekyll serve
# Лимит вывода
{% for article in site.articles limit:3 %}
{% endfor %}
# Условие if на примере выбора секции hero.html
if
{% if page.url == '/' %}
{% include hero.html %}
{% else %}
{% include hero2.html %}
{% endif %}
# Множественное условие
{% if page.url== '/' or page.url== '/about' or page.url== '/delivery' %}
{% endif %}
# Сортировка по дате или позиции пример на сайте - https://learn.siteleaf.com/content/drag-and-drop-position/
{% assign sorted_artists = site.artists | sort:"position" %}
{% for artist in sorted_artists %}
<li>{{ artist.title }}</li>
{% endfor %}
# Также можно утсновить необязательный аргумен "last". Чтобы выводить последнии позиции.
{% assign sorted_artists = site.artists | sort:"position", "last" %}
# Навигация - автоматическое создание пунктов меню и исключение ненужных страниц с навигации ('404.md')
{% for page in site.pages %}
{% unless page.name == '404.md' %}
{% if page.title %}
<li class='c-nav__item' role='presentation'>
<a class='c-nav__link' href='{{ page.url | prepend: site.baseurl }}'>{{ page.title }}</a>
</li>
{% endif %}
{% endunless %}
{% endfor %}
# Добавить к пункту меню класс active
<li class="nav-item {% if page.url== '/contacts.html' %} active {% endif %}">
<a class="nav-link" href="/contacts.html">Contacts</a>
</li>
# Пример создания навигации, с автоматическим добавлением класса active к пунктам меню
=begin
1. Создать папку _data
2. В папке _data, создать файл navigation.yml
Пример структуры файла navigation.yml
- name: Book
link: /book
- name: Documentation
link: /docs
- name: Showcase
link: /showcase
- name: Blog
link: /blog
- name: About
link: /about
=end
# 3. Затем добавить в header, код для вывода элементов меню
<nav role='navigation'>
<ul class='list site-nav'>
{% for link in site.data.navigation %}
{% assign class = nil %}
{% if page.url contains link.link %}
{% assign class = 'site-nav__link--active' %}
{% endif %}
<li class='site-nav__item'><a class='site-nav__link {{ class }}' href='{{ link.link }}'>{{ link.name }}</a></li>
{% endfor %}
</ul>
</nav>
# Сжатия и минификации SCSS файла. Код нужно вставить перед закрывающим тегом head (сам файл main.scss находится в папке _includes).
<style>
{% capture include_to_scssify %}
{% include main.scss %}
{% endcapture %}
{{ include_to_scssify | scssify }}
</style>
# Минификации HTML. Установить плагин с сайта https://github.com/penibelst/jekyll-compress-html
=begin
1. Извлечь файл compress.html
2. Копировать compress.html в папку _layouts
3. В файле расположенном по адресу _layouts/default.html. Установить следующие значения.
---
layout: compress
---
<html>
{{ content }}
</html>
=end