Введение в Twig¶

Twig — быстрый оптимизированный шаблонизатор для PHP. Он с самого начала создавался, чтобы упростить работу с шаблонами и разработчику, и дизайнеру.

Его простой синтаксис и понятные процессы делают его естественным выбором для всех, кто знаком со Smarty, Django, Jinja, Liquid или Stencil.

Мы используем Twig для шаблонов Grav в том числе из-за его гибкости и встроенной безопасности. А то, что он ещё и один из самых быстрых шаблонизаторов для PHP, сделало выбор в пользу Grav очевидным.

Twig компилирует шаблоны в обычный PHP. Это сводит накладные расходы PHP к минимуму и ускоряет работу разработчика.

Это также очень гибкий движок благодаря лексеру и парсеру. Они позволяют разработчику создавать собственные теги и фильтры. Лексер и парсер Twig также позволяют создавать собственный предметно-ориентированный язык (DSL).

Что касается безопасности, Twig не идёт на компромиссы. Он даёт разработчику режим песочницы, позволяющий проверять любой недоверенный код. Это позволяет использовать Twig как язык шаблонов для приложений, давая пользователям возможность изменять дизайн шаблона.

По сути, это мощный движок, который даёт вам контроль над пользовательским интерфейсом. В сочетании с YAML для конфигурации он становится мощной и простой системой для любого разработчика или администратора сайта.

Как работает Twig?¶

Twig убирает всю магию из работы с шаблонами. Шаблоны — это по сути текстовые файлы с переменными или выражениями, которые заменяются значениями при вычислении шаблона.

Теги также важная часть файла шаблона: они управляют логикой самого шаблона.

В языке Twig есть два основных ограничения.

{{ }} выводит результат вычисления выражения;
{% %} выполняет инструкции.

Вот базовый шаблон, созданный с помощью Twig:

<!DOCTYPE html>
<html>
    <head>
        <title>All About Cookies</title>
    </head>
    <body>
        My name is {{ name|e }} and I love cookies.
        My favorite flavors of cookies are:
        <ul>
        {% for cookie in cookies %}
            <li>{{ cookie.flavor|e }}</li>
        {% endfor %}
        </ul>
        <h1>Cookies are the best!</h1>
    </body>
</html>

В этом примере мы задаём заголовок сайта так же, как на любой обычной веб-странице. Разница в том, что с помощью простого синтаксиса Twig мы смогли вывести имя автора и создать динамический список видов печенья.

Сначала шаблон загружается, затем проходит через лексер, где его исходный код разбивается на токены. После этого парсер превращает токены в абстрактное синтаксическое дерево.

Затем компилятор превращает его в PHP-код, который можно выполнить и показать пользователю.

Twig также можно расширять, добавляя собственные теги, фильтры, тесты, операторы, глобальные переменные и функции. Подробнее о расширении Twig — в официальной документации.

Синтаксис Twig¶

Шаблон Twig состоит из нескольких ключевых элементов, которые помогают ему понять, что вы хотите сделать: теги, фильтры, функции и переменные.

Давайте подробнее рассмотрим эти важные инструменты и то, как с их помощью построить отличный шаблон.

Теги¶

Теги сообщают Twig, что нужно сделать. Они позволяют указать, какой код Twig должен обработать, а какой игнорировать при вычислении.

Существует несколько видов тегов, и у каждого свой синтаксис.

Теги комментариев¶

Теги комментариев ({# Insert Comment Here #}) задают комментарии, которые есть в файле шаблона Twig, но не видны конечному пользователю. При вычислении они удаляются, не разбираются и не выводятся.

Удобно использовать их, чтобы объяснить, что делает конкретная строка кода или команда: так другой разработчик или дизайнер в вашей команде быстро прочитает и поймёт её.

Вот пример тега комментария, как он выглядит в файле шаблона Twig:

{# Chocolate Chip Cookies are great! Don't tell anyone! #}

Теги вывода¶

Теги вывода ({{ Insert Output Here }}) вычисляются и добавляются в сгенерированный вывод. Здесь размещается всё, что должно появиться на фронтенде или в другом генерируемом контенте.

Вот пример использования тегов вывода в шаблоне Twig:

My name is {{ name|e }} and I love cookies.

Переменная name вставлена в эту строку, и конечный пользователь увидит My name is Jake and I love cookies., поскольку значением переменной name было Jake.

Внимание

Очень важно либо включить настройку autoescape в конфигурации системы, либо не забывать экранировать каждую переменную в шаблонах фильтром |e, чтобы защитить сайт от XSS-атак. Для безопасного HTML-контента используйте фильтр |raw.

Теги действий¶

Теги действий — самые деятельные в мире Twig. Эти теги действительно что-то делают, в отличие от остальных, которые либо передают что-то дальше, либо лежат без дела в исходном коде в ожидании дизайнера.

Теги действий задают переменные, перебирают массивы и проверяют условия. Ваши инструкции for и if создаются с помощью этих тегов.

Вот как тег действия может выглядеть в шаблоне Twig:

{% set hour = now | date("G") %}
{% if hour >= 9 and hour < 17 %}
    <p>Time for cookies!</p>
{% else %}
    <p>Time to bake more cookies!</p>
{% endif %}

Первый тег действия задаёт переменной hour текущий час по 24-часовой шкале. Затем это значение используется для проверки, находится ли время между 9:00 и 17:00. Если да, выводится Time for cookies!. Если нет, вместо него выводится Time to bake more cookies!.

Очень важно, чтобы теги не перекрывались. Нельзя поместить тег вывода внутрь тега действия или наоборот.

Фильтры¶

Фильтры полезны, особенно когда вы используете теги вывода для отображения данных, которые могут быть отформатированы не так, как вам нужно.

Допустим, значение переменной name может содержать нежелательные теги SGML/XML. Их можно отфильтровать таким кодом:

{{ name|striptags|e }}

Функции¶

Функции могут генерировать контент. Обычно за ними следуют аргументы в скобках сразу после вызова функции. Даже если аргументов нет, после функции всё равно ставятся скобки ().

{% if date(cookie.created_at) < date('-2days') %}
    {# Eat it! #}
{% endif %}