Синтаксис шаблонов

Движок outofbox.ru в качестве шаблонизатора использует Twig (http://twig.sensiolabs.org/)

Twig – это шаблонизатор с простым и понятным синтаксисом. Более подробно почитать про его особенности и синтаксис можно в официальной документации по адресу http://twig.sensiolabs.org/documentation

Twig шаблоны в системе outofbox.ru должны иметь расширение .html.twig

Одной из очень удобных функций Twig является функция наследования шаблонов. Большинство сайтов имеют элементы, которые отображаются на всех страницах, например, header и footer сайта. Нет нужды вставлять однотипные участки в каждый шаблон. Вместо этого, можно наследоваться от базового шаблона.

Ниже приведен пример такого базового шаблона. Называться он может как угодно и располагаться в любом подкаталоге каталога Outofbox/Templates. Но рекомендуем использовать в качестве имя для такого шаблона layout.html.twig и хранить его в корне каталога.

layout.html.twig

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="utf-8">
    <title>{% block page_title %}Сайт{% endblock %}</title>
</head>
<body>
{% block content %}{% endblock content %}
</body>
</html>

Для наследования используются блоки. Блок состоит из открывающей конструкции {% block <block-name> %}, тела блока и закрывающей конструкции {% endblock <block-name> %}. Имя блока должно быть уникальным в пределах одного шаблона.

В данном примере заявлено два блока: page_title и content. Любой из этих блоков будет доступен для дополнение/изменения в наследующих шаблонах.

Теперь создадим шаблон homepage.html.twig, который отвечает за отображение главной страницы сайта:

homepage.html.twig

{% extends '@skin/layout.html.twig' %}

{% block content %}
    <h1>Главная страница</h1>
    <p>Добро пожаловать!</p>
{% endblock %}

Как видно, данный шаблон содержит только то, что относится к отображению главной страницы. При обработке данного шаблона будет взят за основу шаблон layout.html.twig и в нем произойдет замена содержимого блоков.

Обратите внимание, что синтаксис {% endblock %} может как содержать имя закрывающего блока, так и быть без него

Тогда результирующий html будет выглядеть следующим образом:

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="utf-8">
    <title>Сайт</title>
</head>
<body>
    <h1>Главная страница</h1>
    <p>Добро пожаловать!</p>
</body>
</html>

Как видно, содержимое блока content из шаблона homepage.html.twig отобразилось в том месте, где заявлен блок content в шаблоне layout.html.twig. Обратите внимание на тег <title>. Так как мы не переопределили блок page_title в нашем шаблоне, то был использован контент блока из базового шаблона. Если мы поменяем шаблон следующим образом:

homepage.html.twig

{% extends '@skin/layout.html.twig' %}

{% block page_title %}Главная страница сайта{% endblock %}
{% block content %}
    <h1>Главная страница</h1>
    <p>Добро пожаловать!</p>
{% endblock %}

То результирующий html будет следующим:

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="utf-8">
    <title>Главная страница сайта</title>
</head>
<body>
    <h1>Главная страница</h1>
    <p>Добро пожаловать!</p>
</body>
</html>

Таким образом можно полностью переопределять блоки. Помимо переопределения содержимого блока, его можно дополнять. Для этого используется специальная функция {{ parent() }} внутри блока.

Например, изменим наш блок следующим образом:

{% block page_title %}Главная страница сайта. {{ parent() }}{% endblock %}

И тогда title изменится следующим образом:

<title>Главная страница сайта. Сайт</title>

Далее: Переменные и функции

Свой сайт

Синтаксис шаблонов

Оставьте заявку