Что нового в темах Drupal 8

Вопрос нововведений в темах Drupal 8 меня, как фронтенд разработчика, интересовал более всего. По-этому, когда мне, благодаря компании в которой я работаю, выпала возможность пройти курс DRUPAL 8 THEMING GUIDE от Drupalize.me, я с огромным интересом ознакомился с курсом. Ниже я написал небольшой обзор о нововведениях в темах Drupal 8. Возможно, этот обзор не будет уж очень детальным — он и не претендует на звание полного обзора. Для, тех, кто хочет узнать больше деталей я бы рекомендовал ознакомится с материалами курса, о котором я сказал выше и, конечно же, ознакомиться с документацией по темам восьмерки на сайте Drupal.org.

Файл info в формате .yml

Теперь файл с информацией о теме имеет формат .yml. Это, казалось бы небольшое нововведение, добавляет больше порядка и логики в описание темы. Также добавляет возможности для описания зависимостей, но об этом позднее.  Пока только стоит сказать, что для вашей темы это единственный обязательный файл и в нем обязательно должны быть лишь три строки: name, type, core.

# my_theme.info.yml file for My Theme.
name: 'My Theme'
type: theme
core: 8.x

Также стоит отметить что к темам, добавился еще ряд конфигурационных файлов, тоже в формате .yml. О некоторых из них я напишу ниже.

В info-файле не нужно объявлять регионы по умолчанию

Опять же, нововведение минорное, но о нем стоит упомянуть, хотя бы из-за того, что если вам нужно объявить хотя бы один дополнительных регион для вашей темы, то вам нужно также указать и все регионы по умолчанию, в случае, если они вам нужны. Иначе в теме будет доступен только тот регион, который вы объявили.

Движек шаблонов по умолчанию — Twig

Как по мне, так это очень крутое нововведение. О Twig можно писать много, но лучше всего о нем расскажет его документация. Самое главное, что даже если вы совсем не знаете PHP, вид шаблона вас не испугает. Естественно нужно знать PHP для полноценной работы Drupal.

Очень крутым достижением перехода на Twig можно считать наличие собственного режима отладки. Это опцию вы сможете включить с изменением настроек сервисов, путем активации файла development.services.yml. Вот пара ссылок по теме: https://www.drupal.org/node/2259531, https://www.drupal.org/node/1906392.

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

Вместо template.php теперь используется my_theme.theme

Нововведение минорное, потому как внутри тот же PHP, но о нем стоит упомянуть. То есть теперь весь PHP  код с препроцесс-хуками, альтерами и прочим мы пишем в этом файле.

Брикпоинты устанавливаются в теме с помощью my_theme.breakpoints.yml

Если ваша тема использует отзывчивую верстку, то в корне должен лежать файл my_theme.breakpoints.yml, который будет указывать, какие брикпоинты вы используете в настройках адаптивности вашей темы. Вот пример такого файла темы Бартик:

bartik.mobile:
  label: mobile
  mediaQuery: ''
  weight: 0
  multipliers:
    - 1x
bartik.narrow:
  label: narrow
  mediaQuery: 'all and (min-width: 560px) and (max-width: 850px)'
  weight: 1
  multipliers:
    - 1x
bartik.wide:
  label: wide
  mediaQuery: 'all and (min-width: 851px)'
  weight: 2
  multipliers:
    - 1x

В первую очередь он используется для того, чтобы предоставить специфические для вашей темы параметры набора конфигурации для адаптивных изображений. По умолчанию в ядро включен и активирован модуль Breakpoints, который и будет делать брикпоинты вашей темы доступными для других модулей, вот ссылка на доки из Drupal.org. Модуль Responsive Image тоже включен в ядро восьмерки, но не активирован по умолчанию, так что, если вам нужны адаптивные картинки на сайте, то нужно активировать этот модуль.

Все JavaScript файлы теперь помещаются в нижнюю часть документа

Наконец-то, вам теперь не нужно указывать регион footer в параметрах подгружаемых скриптов, чтобы добавить скрипт не в head, а перед закрывающим тегом body вашего документа. То, что это сделали по умолчанию, говорит о том, что разработчики Drupal уделяют не последнее внимание производительности фронтенда.

Управление JavaScript и CSS теперь происходит с помощью my_theme.libraries.yml

Теперь для загрузки стилей и скриптов вашей темы вам нужно использовать my_theme.libraries.yml. В этом файле вы можете как указать собственные файлы стилей, библиотеки и просто скрипты, так и сослаться на существующие стили или библиотеки ядра. Например Drupal 8  помимо знакомого jQuery использует по умолчанию Backbone.js и Underscore.js, Modernizr,  а также Picturefill (нужен для адаптивных картинок).

Вы можете подключать ваши библиотеки, объявленные в файле my_theme.libraries.yml несколькими способами:

1. объявив их в инфо-файле темы (в этом случае они будут загружаться по всему сайту);
2. объявив вызов внутри препроцесса или альтера вашей темы;
3. можно подгружать JavaScript and CSS выборочно, вызывая библиотеку внутри Twig шаблона.

Более детально почитать об этом можно на сайте Drupal.org.

Итоги

Думаю, что даже этот поверхностный список нововведений дает понять, что в Drupal 8 к разработке тем (и в целом фронтенду) подошли очень серьезно. Мы получили очень гибкую, настраиваемую среду, для создания современных интерфейсов.

Как я и говорил выше, этот обзор не претендует на звание полного, однако информации, изложенной в нем достаточно, чтобы заинтересовать вас самостоятельно «покрутить» темы в Drupal 8.