Как создать тему в Drupal 8?

Тему можно создавать с нуля, а можно взять за основу готовую тему и создать свою как под тему (sub-theme). Под тема отличается от основной темы только тем, что следует ресурсы родительской темы. Можно создавать произвольные цепи под тем, каждая из которых будет следовать ресурсы с родительской. Это дает возможность не прописывать все кастомные, а пользоваться уже готовым (например файлами css или javascript), заменяя все, что нужно, своим.

За основу можно взять тему classy. Она используется как базовая для таких тем ядра, как bartik и seven, и обеспечивает свои под темы многими классами, которые помогают выводить элементы разметки на страницу.
Главным файлом темы есть файл info.yml, который задает всю базовую информацию. Это замена.info файлов седьмого Друпала, их использование дает больше возможностей и гибкости в настройке темы. Аналогичные файлы создаются для модулей, поэтому важно задать для ключа «type» значение «theme». Под тема создается, как и любая тема, только добавляется сертификат «base theme».

  • Name (обязательно) — читабельное для людей (human-readable) название темы, которое будет отображаться в списке тем на странице Appearance
  •  description (обязательно) — описание, которое будет так же освещаться на странице Appearance;
  • package — название группы, в которую группируются темы с таким значение этого ключа;
  • type (обязательно) — тип расширения, для тем всегда будет иметь значение «theme»;
  • base theme — базовая (родительская) тема для данной, если мы создаем под тему
  •  core (обязательно) — версия Друпала, с которой наша тема совместима;
    version — версия модуля, если он размещается на drupal.org;
  • screenshot — фотография (может быть скриншот), который будет отображаться на странице Appeiarance. Если не задать этого ключа, тогда Drupal искать файл с именем «screenshot.png» в папке с темой, чтобы отразить;
  • libraries — библиотеки, содержащие css и js файлы, которые будут добавляться ко всем страницам. О добавлении библиотек есть целая статья на drupal.org. Если коротко, то к теме добавляется еще один файл типа my_theme.libraries.yml
  • Breakpoints — это точки, в которых сайт меняет расположение элементов, в зависимости от ширины экрана, используя media query в CSS. Брейкпоинта задаются в файле.breakpoints.yml. После установки их в теме, к ним будут иметь доступ различные модули или другие темы, которые создают функциональность, зависит от брейкпоинтов.

Функции темизации и шаблоны

Drupal 8 пользуется Twig. Это двигатель шаблонов (template engine) для PHP и является частью фреймворка Symfony. Все функции типа theme_ * и файлы *.tpl.php заменены twig файлами *.htmll.twiig.

Drupall 8 позволяет перезаписывать (overriding) любые шаблоны, используемые для генерации html-разметки. Если нужно перезаписать шаблон ядра или иной темы, нужно в директорию templates, что лежит в директории темы добавить.html.twig файл с соответствующим именем.

Можно скопировать тот файл с кодом, который нужно заменить своим. После этого чистим кэш и можем редактировать свой файл. Теперь Drupal будет запускать наш файл, вместо своей (вместо файла ядра или темы). Важно: нельзя менять Twig файлы ядра, нужно делать копии этих файлов в своей теме или модули и там менять.

Если нужно внести свои изменения не во все страницы, а только в какие-то более конкретные, нужно добавить еще один файл (или скопировать базовый) и изменить имя. Например, если надо сделать шаблон для всех нод типа article, копируем файл node.htmll.twiig, даем ему имя node — articlle.html.twiig. Именно этот новый файл Drupal искать в первую очередь, а если не найдет, будет использовать базовый (то есть node.htmll.twiig). Подробнее об именовании шаблонов здесь. Процесс когда Drupal определяет, возможные имена файл шаблона может использовать, называется theme hook suggestion. Чтобы добавлять или изменять suggestions, существуют три хука:

В восьмом Друпалом больше не используется php код для написания шаблонов темы, только Twig. Twig имеет отдельный синтаксис. Файлы.html.twig начинаются с описания переменных, используемых в данном файле. Далее идет html-разметка со вставками кода.

 Выводы

Основным отличием в темизации Drupal 8 от предыдущих версий является Twig, который изменил основанную на php-шаблоны систему Темизация Drupal 7 и старше его. Twig дает возможность дизайнерам со знанием html / css модифицировать разметку страниц, не будучи экспертом в php. Например, вместо того чтобы понимать синтаксическую отличие между многомерными массивами и объектами, и знать что где используется, они могут юзать конструкцию {{foo.bar}}, которая выполнит эту работу. В общем, изменений достаточно много, к ним придется привыкать. Но изменения — это двигатель прогресса.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

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