Создание субтемы Drupal с помощью Omega 4 на сервере Ubuntu

Omega – одна из самых популярных базовых тем Drupal. Версия 4 существенно отличается от предыдущей версии и предоставляет гибкий пользовательский интерфейс, а потому остаётся основной темой для разработчиков фронт-энда.

Это пошаговое руководство продемонстрирует установку Omega 4 и создание подтемы.

Примечание: Для выполнения руководства необходим настроенный виртуальный выделенный сервер и предварительно установленные программы Drush и Drupal (инструкции по установке можно найти в этой статье).

Пользователи

Вместо пользователя root рекомендуется использовать учётную запись с расширенными привилегиями. Создайте нового пользователя (в руководстве его зовут omegauser):

sudo adduser omegauser

Следуйте инструкциям мастера, затем добавьте нового пользователя в группу sudoers, чтобы предоставить права sudo:

sudo adduser omegauser sudo

Теперь можно приступать к выполнению руководства.

Установка Omega 4

Загрузите тему Omega для Drupal; для того можно использовать Drush. Откройте любой каталог сайта Drupal и запустите:

sudo drush dl omega

На данный момент Omega 4 является рекомендуемым релизом, потому Drush загрузит её автоматически. Включите Omega 4 при помощи команды:

sudo drush en omega

Очистите кэш:

sudo drush cc all

Установите пакет unzip, который пригодится в дальнейшей работе:

sudo apt-get install unzip

Установка RVM

Поскольку Omega 4 позволяет использовать Sass, Compass, Susy и многие другие полезные программы, написанные в Ruby, на данном этапе нужно установить Ruby и Ruby gems. Но прежде рекомендуется установить менеджер RVM (Ruby Version Manager):

\curl -L https://get.rvm.io | bash

Чтобы запустите RVM, используйте:

~/.rvm/scripts/rvm

Чтобы убедиться в том, что все зависимости Ruby уже установлены, запустите команду:

rvm requirements

Позже для корректной работы темы нужно будет установить Rubygems и Bundler.

Подтема Omega

Теперь нужно сгенерировать подтему. Откройте любой подкаталог Drupal и запустите команду:

sudo drush omega-wizard

Следуйте инструкциям терминала: выберите имя для темы (например, mytheme), укажите базовую тему (Omega), пусковой набор (Basic), назначение (к примеру, Site) и сайт (в случае размещения одного сайта введите all). Также удалите стандартный файл readme и включите новую тему как стандартную тему сайта.

Примечание: Для всего этого необходима утилита unzip.

Откройте сайт, и на экране появится новая тема.

Установка Ruby и Gems

Откройте каталог новой темы:

cd /var/www/drupal/sites/all/themes/mytheme

На экране появится сообщение примерно такого содержания:

ruby-1.9.3-p448 is not installed.
To install do: 'rvm install ruby-1.9.3-p448'

Версия Ruby будет отличаться в зависимости от используемой версии Omega. Поскольку многие Gem-ы для расширения этой темы, постоянно обновляются (например, Sass), есть высокий риск, что синтаксис будет изменён, что повлияет на совместимость.

В каталоге подтемы найдите два файла, .ruby-gemset и .ruby-version; они задают версию Ruby и окружение gemset, которые будут использоваться в этой папке. Таким образом, можно легко настроить подтему Омега 4 для использования любой другой версии Ruby и другого gemset-а.

Итак, теперь нужно установить указанную в сообщении версию Ruby; для этого запустите:

rvm install ruby-1.9.3-p448

Примечание: При необходимости измените версию Ruby в команде.

Можно также проверить версию Ruby в файле .ruby-version. После завершения установки необходимой версии Ruby запустите следующую команду:

rvm list

Примечание: Перед запуском команды убедитесь, что вы находитесь в папке подтемы.

Если на данный момент установлена всего одна версия Ruby, она не нуждается в дополнительной настройке. Вышеприведённая команда очень полезна, она выводит список установленных версий Ruby и сведения об их использовании в текущем окружении.

Теперь можно установить gem-ы, необходимые для работы подтемы (Sass, Compass, Susy и все остальные gem-ы, указанные в файле Gemfile). Запустите:

bundle install

Это установит индивидуальный набор gem-ов, что можно отследить по сообщениям терминала. Кроме того, при этом будет создан файл Gemfile.lock, который будет отслеживать точные версии устанавливаемых gem-ов. Потому при повторном запуске команды install будет установлен точно такой же набор gem-ов, что предотвращает возникновение конфликта версий.

При возникновении ошибки «Gemfile.lock cannot be written due to permissions issues» нужно убедиться в том, что новая субтема принадлежит текущему пользователю (который запустил команду bundle install):

chown -R omegauser /var/www/drupal/sites/all/themes/mytheme

Чтобы протестировать работу Sass, отредактируйте какой-нибудь файл .scss в папке sass:

cd /var/www/drupal/sites/all/themes/mytheme/sass/

Внесите в него следующий код:

body {
background-color:red;
}

Обновите страницу сайта в браузере. Скомпилируйте Sass и конвертируйте код в обычный CSS. Для этого можно использовать Compass, запустив следующую команду в каталоге субтемы:

compass compile

На экране должно появиться сообщение; обновив страницу браузера, вы конвертируете Sass в CSS (проверьте каталог css/).

При разработке рекомендуется компилировать изменения файлов .scss автоматически; для этого запустите команду:

compass watch

Эта команда будет отслеживать все изменения в файлах и автоматически компилировать их. Чтобы остановить отслеживание файлов, нажмите CTRL-C.

Примечание: Больше информации о работе Sass можно найти в этом руководстве.

Tags: , , , , , , ,

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