Думаю, многие из вас уже успели познакомиться с Drupal 8 и его многочисленными изменениями и наверняка уже знаете, что в основу новой ветки пришел и новый шаблонизатор, взамен PHPTemplate – Twig. Сегодня мы рассмотрим основы данного шаблонизатора, дабы в следующих уроках по созданию темы для Drupal 8, вы понимали его специфичный синтаксис.
Итак, начнем с базовых вещей:
Вставка комментария:
#PHPTemplate <?php /** * @file * File description */ ?> #Twig {# /** * @file * File description */ #}
Имена файлов и функций:
#PHPTemplate node--article.tpl.php theme_node_links() #Twig node--article.html.twig node-links.html.twig
Хочу заменить, что в Drupal 7 для темизации, используются как функции темизации, например как theme_links(), так и шаблоны шаблонизатора PHPTemplate, например node.tpl.php. В Drupal 8 постарались полностью отказаться от функций темизаций и возложить всё на шаблоны Twig. Системные файлы шаблонов можно найти по пути
core/modules/system/templates
Так же некоторые системные модули, например node, так же имеют свои шаблонные файлы.
core/modules/node/templates
Так же, вам необходимо знать, что все файлы шаблонизатора Twig компилируются один раз и скомпилированная копия файла сохраняется по пути
sites/default/files/php/twig
и при каждой последующей загрузке страницы забирается его копия. Обновление файлов происходит после очистки кеша, так что не забывайте включать режим отладки, при разработке вашей темы.
Вывод переменных:
#PHPTemplate: <?php print $content; ?> #Twig: {{ content }}
Вывод полей:
// Пропущенный через файл темизации #Twig: {{ content.field_name }} // Сырое значение первого поля #Twig: {{ content.field_name.0 }}
Создание кастомных переменных:
#PHPTemplate: <?php $custom_var = $content->comments; ?> #Twig: {% set custom_var = content.comments %}
Присвоение массива:
#PHPTemplate: #Twig: {% set args = {'!author': author, '!date': created} %}
Вывод атрибутов:
#PHPTemplate: <?php print $item['#item']['alt']; ?> #Twig: {{ item['#item'].alt }}
Добавление/удаление атрибута:
#Добавление атрибута #Twig: {{ attributes.setAttribute('id', 'my-id') }} #Twig: {{ attributes.setAttribute('data-example', 'newvalue') }} #Удаление атрибута #Twig: {{ attributes.removeAttribute('id', 'my-id') }}
Проверка на наличие атрибута:
#Twig: {% if attributes.hasClass('myClass') %} {% endif %}
Добавление/удаление класса CSS:
#Добавление класса #Twig: {{ attributes.addClass('my-class') }} #Удаление класса #Twig: {{ attributes.removeClass('my-class') }} #Групповая обработка #Twig: {{ attributes.addClass('my-class').removeClass('my-class-active') }}
Управляющая конструкция if else:
#PHPTemplate: <?php if ($content->comments): endif; ?> #Twig: {% if content.comments %} {% endif %} #PHPTemplate: #Twig: {% if content.comments is not empty %} {% endif %} #PHPTemplate: #Twig: {% if content.comments is defined %} {% endif %} #PHPTemplate: <?php if ($count > 0): endif; ?> #Twig: {% if count > 0 %} {% endif %}
Управляющая конструкция foreach:
#PHPTemplate: <?php foreach ($users as $user) {} ?> #Twig: {% for user in users %} {% endfor %}
Фильтры:
#Пропустить строку через фильтр Check_plain: #PHPTemplate: <?php print check_plain($title); ?> #Twig: {{ title|striptags }} Перевод строки: #PHPTemplate: <?php print t('Home'); ?> #Twig: {{ 'Home'|t }} Перевод строки с заменой: #PHPTemplate: #Twig: {{ 'Welcome, @username'|t({ '@username': user.name }) }} Получить список элементов из массива #PHPTemplate: #Twig: {{ usernames | join(', ') }}
Использование функций:
#Twig:
Здесь естественно не весь список, а лишь основы, которые вы будете использовать в 90% случаях при создании вашей кастомной темы. Я же, в свою очередь будут стараться обновлять данный список. Если вы считаете, что в данном списке что-то не хватает, то пишем в комментариях.
UPD:
С помощью модуля twig_field_value - можно получить дополнительные форматы вывода полей. В описании модуля продемонстрированы примеры.