Шаблонизатор Twig⚓︎
Twig — быстрый оптимизированный шаблонный движок для PHP. Он разработан с нуля, чтобы облегчить создание шаблонов как разработчику, так и дизайнеру.
Лёгкий синтаксис и простые процессы делают его естественным для всех, кто знаком с Smarty, Django, Jinja, Liquid или Stencil.
Мы используем его для наших шаблонов Grav отчасти из-за его гибкости и присущей ему безопасности. Тот факт, что это один из самых быстрых шаблонизаторов для PHP, сделал его выбор для использования в Grav несомненным.
Twig компилирует шаблоны в простой PHP. Это сокращает количество накладных расходов на PHP до минимума, что приводит к более быстрой и оптимизированной работе разработчиков.
Кроме того, это очень гибкий движок благодаря лексеру и парсеру. Это позволяет разработчику создавать свои собственные теги и фильтры. Лексер и синтаксический анализатор Twig также позволяет создавать собственный предметно-ориентированный язык (DSL).
Когда речь заходит о безопасности, Twig не срезает углы. Он предоставляет разработчику режим «песочницы», в котором он может изучить любой недоверенный код. Это дает возможность использовать Twig в качестве языка шаблонов для приложений, предоставляя пользователям возможность изменять дизайн шаблона.
По сути, это мощный движок, который дает вам контроль над пользовательским интерфейсом. В сочетании с YAML для конфигурирования, это делает мощную и простую систему для работы с любым разработчиком или менеджером сайтов.
Как работает Twig?⚓︎
Twig работает, убирая все «фокусы» из дизайна шаблонов. Шаблоны - это, по сути, просто текстовые файлы, содержащие переменные или выражения, которые заменяются значениями по мере анализа шаблона.
Теги также являются важной частью файла шаблона, так как они контролируют логику самого шаблона.
В Twig есть два основных языковых ограничения.
{{ }}
выводит результат вычисления выражения;{% %}
выполняет инструкции.
Вот базовый шаблон, созданный с помощью Twig:
<!DOCTYPE html>
<html>
<head>
<title>Всё о печенюшках</title>
</head>
<body>
Меня зовут {{ name }} и я обожаю печенье.
Мои самые любимые виды печенья:
<ul>
{% for cookie in cookies %}
<li>{{ cookie.flavor }}</li>
{% endfor %}
</ul>
<h1>Печенье — лучшее, что придумано человеком!</h1>
</body>
</html>
В этом примере мы устанавливаем заголовок сайта так же, как и для любой стандартной веб-страницы. Разница в том, что мы смогли использовать простой синтаксис Twig для представления имени автора и создания динамического списка типов элементов.
Шаблон сначала загружается, а затем передается через lexer, где его исходный код маркируется и разбивается на мелкие кусочки. В этот момент синтаксический анализатор принимает токены и превращает их в абстрактное синтаксическое дерево.
Как только это делается, компилятор превращает это в PHP-код, который затем может быть проанализирован и отображён пользователю.
Twig также может быть расширен для добавления дополнительных тегов, фильтров, тестов, операторов, глобальных переменных и функций. Более подробную информацию о расширении Twig можно найти в его официальной документации.
Синтаксис Twig⚓︎
Шаблон Twig имеет несколько ключевых компонентов, которые помогают ему понять, что именно вы хотели бы сделать. К ним относятся теги, фильтры, функции и переменные.
Давайте более подробно рассмотрим эти важные инструменты и то, как они могут вам помочь создать невероятный шаблон.
Теги⚓︎
Теги говорят Twig, что ему нужно делать. Он позволяет вам установить, какой код Twig должен обрабатывать, а какой — игнорировать во время анализа.
Существует несколько различных типов тегов, и каждый из них имеет свой собственный специфический синтаксис, который отличает их друг от друга.
Комментарии⚓︎
Теги комментариев (`{#Insert Comment Here#}') используются для установки комментариев, которые существуют в файле шаблона Twig, но фактически не видны конечному пользователю. Они удаляются во время парсинга, не анализируются и не выводятся.
Хорошо использовать эти теги для объяснения того, что делает конкретная строка кода или команда, чтобы другой разработчик или дизайнер в вашей команде мог быстро прочитать и понять.
Вот пример тега комментария, который вы найдете в файле шаблона Twig:
Выходные теги⚓︎
Теги вывода ({{ Insert Output Here }}) будут проанализированы и добавлены в сгенерированный вывод. Здесь вы поместите всё, что хотите отобразить на главной странице или в другом генерируемом контенте.
Вот пример выходных тегов, используемых в шаблоне Twig:
Переменная name
была вставлена в эту строку и будет показана конечному пользователю как Меня зовут Джейк и я обожаю печенье.
, так как Джейк
было значение переменной имени.
Очень важно включить параметр autoescape
в конфигурации системы или не забыть экранировать каждую переменную в файлах шаблонов с помощью фильтра |e
, чтобы защитить сайт от XSS-атак. Для безопасного HTML-контента используйте фильтр |raw
.
Теги действий⚓︎
Теги действий — это путеводители в мире Twig. Эти теги на самом деле что-то делают, в отличие от других, которые либо передают что-то, либо сидят сложа руки в исходном коде, ожидая, пока дизайнер прочитает его.
Теги действий задают переменные, цикл через массивы и условия тестирования. Ваши for
и if
заявления сделаны с использованием этих меток.
Вот как может выглядеть тег действия в шаблоне Twig:
{% set hour = now | date("G") %}
{% if hour >= 9 and hour < 17 %}
<p>Время печенья!</p>
{% else %}
<p>Пора испечь ещё печенюшек!</p>
{% endif %}
Первоначальный тег действия устанавливает час как текущий час в 24-часовом формате. Это значение затем используется для определения, находится ли оно между 9 утра и 5 вечера. Если это так, то отображается Время для печенюшек!
. Если это не так, то вместо этого отображается Пришло время испечь ещё печенья!
.
Очень важно, чтобы метки не перекрывали друг друга. Вы не можете поместить выходной тег внутри тега действия или наоборот.
Фильтры⚓︎
Фильтры полезны, особенно когда вы используете выходные теги для отображения данных, которые могут быть отформатированы не так, как вы хотите.
Допустим, значение переменной name
может включать нежелательные SGML/XML тэги. Вы можете отфильтровать их, используя код, приведенный ниже:
Функции⚓︎
Функции могут генерировать контент. За ними, как правило, следуют аргументы, которые появляются в скобках, помещаемых непосредственно после вызова функции. Даже если аргумент отсутствует, функция все равно будет иметь скобки ()
, расположенные непосредственно после нее.