11. Zen. Начало

01.10.2012

Приступаем к освоению важной части Drupal, в которой я не очень силён, к "художественному оформлению" сайта. Так что статьи в этой области будут появляться, что называется, вживую - подготовленный материал будет выкладываться сюда по мере его осмысления и освоения мной. Строить новый дизайн я буду на основе темы Zen, установленной ранее. Zen - очень популярный и постоянно развивающийся проект, к тому же он неплохо документирован.

Одной из основных краеугольных концепций Drupal является принцип, положенный в основу объектно-ориентированного проектирования - наследование. Кстати, насколько я знаю, Drupal 8 должен стать уже полностью объектно-ориентированной системой. Семёрка построена на классической процедурной парадигме, но идеологически реализует принципы наследования. Это касается также и системы тем. Понятия тема-подтема по своим принципам реализации тождественны понятиям класса-родителя и класса-наследника.

Что такое тема с точки зрения программиста? Это каталог, расположенный в /sites/all/themes, с набором файлов и других каталогов. Некоторые файлы обязательны. Например, обязателен файл имя_темы.info, своего рода описание класса. Имя_темы должно совпадать с каталогом, в котором она расположена. Собственно, самую простейшую собственную тему для Drupal можно создать всего лишь создав свой каталог с одноимённым .info-файлом внутри и заполнив в нём несколько строк:
    name = имя_темы
    core = 7.x
    engine = phptemplate
Этого уже будет достаточно для того, чтобы тема с названием имя_темы появилась в списке тем в меню "Внешний вид" ("Appearance"). И не просто появилась, эту тему вполне можно включить и использовать! Конечно, она ничем не будет отличаться от стандарта, принятого на уровне ядра Drupal, но будет вполне работоспособна. Кстати, примером темы, являющейся фактически такой же, как и наша имя_темы, является Stark, входящая в дистрибутив Drupal. Можно посмотреть ей "внутрь", чтобы в этом убедиться. От полного дефолта её отличает лишь небольшой css.

Такое поведение системы возможно лишь с использованием наследования. Описанным выше способом мы создали собственный "класс" имя_темы, который унаследовал все заложенные разработчиками шаблоны для вывода html, блоков, нод и т.п. Эти стандартные шаблоны расположены внутри модулей ядра. Например, в /modules/block лежит файл block.tpl.php, в /modules/node - node.tpl.php. Если нужно изменить шаблон, достаточно в каталоге своей темы создать каталог templates и положить в него, к примеру, исправленный block.tpl.php. Этим самым мы добьёмся того, что при выводе блока наша тема будет использовать свой переопределённый шаблон блока, а не стандартный из ядра.

Нужно отметить, что с точки зрения веб-разработчика, которому нужно не только создать некий сайт, но ещё и поддерживать его в дальнейшем, такой подход является просто находкой. Мне попадались курсы изучения CMS, в которых авторы предлагали после установки системы, модулей и близкой по выбранному дизайну темы в дальнейшем "подгонять" сайт у нужному виду путём редактирования файлов, в которых будет найден нужный элемент. Найтись этот элемент мог и в файлах темы, и в модуле, и в компонентах ядра... Что потом делать в случае необходимости обновить CMS до более свежей версии, авторы умалчивали.

Идеология Drupal предлагает разработчику не менять неподходящие ему компоненты в системе, а унаследовав старое, изменить то, что необходимо. Поэтому всем настойчиво рекомендуется в установленном Drupal не трогать ничего, кроме того, что располагается внутри каталога /sites. Да и там, к примеру, в /sites/modules тоже не рекомендуется редактировать сторонние модули, поскольку они тоже подлежат обновлению. Разве только если это не ваш собственный модуль.

Продолжая разговор о наследственности, добавим, что механизм темизации предполагает наследование не только от заложенной в ядре по умолчанию темы. Наследовать можно также от любой другой установленной темы. Для этого достаточно прописать в имя_темы.info строчку
    base theme = имя_темы_родителя
и все заложенные в родительскую тему шаблоны, таблицы стилей и т.п. будут доступны в нашей теме. Нужные нам вещи необходимо будет переопределить, что-то собственное добавить. Важно отметить, что тема-родитель должна быть установлена (включать её не обязательно) в Drupal, иначе невозможно будет наследовать её параметры.

Zen отличается от других таким образом, что является как раз основой для создания других тем, этаким абстрактным классом, если говорить на языке объектно-ориентированного программирования. Сама по себе Zen не представляет из себя ничего такого уж выдающегося, об этом можно судить по нынешнему "дизайну" моего сайта, где она включёна по умолчанию без каких-либо изменений. Зато по способности предоставлять свои ресурсы для разработки чего-то нового она практически не имеет себе равных. Это подтверждается внушительным списком  популярных тем, построенных на её основе.

Закругляя и так затянувшееся предисловие, всё же необходимо отметить ещё один момент. Тема Zen существует в двух различных версиях, точнее ветках разработки - 3.х и 5.х. Третья версия классическая, предназначена для стандартных разрешений экрана на мониторе. Версия 5.x более новая и современная, она поддерживает HTML5 и расширения css - SASS и COMPASS. Она поддерживает концепцию RWD - Responsive Web Design, т.е. дизайн, адекватно отображающий контент на экранах любого размера. Прежде всего, это касается, конечно, мобильных устройств. Есть в ней и собственные изюминки, вроде Zen Grids. Я надеюсь, что придёт время для разбора и всех этих новинок. Пока у меня установлена тема Zen 3.1 и я собираюсь построить на её основе собственную подтему.

Итак, как я уже писал выше, собственная тема должна лежать в каталоге /sites/all/themes. Для того, чтобы создать подтему на основе Zen, не нужно создавать каталоги и файлы собственноручно. Внутри /sites/all/themes/zen есть каталог STARTERKIT, который является заготовкой для будущей подтемы. Его нужно скопировать и разместить как отдельную тему. Я думаю, нагляднее это продемонстрировать можно на локальном сервере. Вот тут лежат темы:
111
Заходим в тему zen и копируем там каталог STARTERKIT.

Вставляем его, как новую тему.

Переименовываем каталог соответственно придуманному названию нашей темы.

Переименовываем .info-файл и осуществляем замену соответствующих строк в файлах template.php и theme-settings.php

Изменяем наименование темы внутри .info файла

По сути, всё! Осталось зайти во "Внешний вид", включить нашу новую тему и установить её по умолчанию.

Тема freetechno на данный момент ничем не отличается от Zen, но она уже является самостоятельной. Ещё стоит добавить, что не нужно давать темам названия, совпадающие с названием модулей. От этого происходит конфликт пространства имён и сайт будет работать некорректно. В следующей статье уже вплотную приступим к дизайну.
 



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