Руководство по Zen для Drupal

Матеріал з Wiki.Zina
Перейти до навігації Перейти до пошуку

Установка

[ред. | ред. код]

1. Сачайте Zen: http://drupal.org/project/zen

2. Разархивируйте и папку zen поместите в папку sites/all/themes

3. Авторизуйтесь как админ и перейдите Administer → Site building → Themes (admin/build/themes) и сделайте Zen или одну из его субтем темой по умолчанию.

Всего в админке станут доступны темы:

  • Zen — основная тема
  • Zen Classic — html и css для Zen 0.7
  • STARTERKIT — заготовка для создания собственных субтем Zen

Создание собственной субтемы Zen

[ред. | ред. код]

1. Скопируйте папку STARTERKIT в папку уровнем выше и переименуйте ее. Например: sites/all/themes/zen/STARTERKIT в sites/all/themes/my_zen_theme. ВАЖНО: в имени папки допустимы только латиница в нижнем регистре и знак подчеркивания.

2. В новой папке с темой найдите файл STARTERKIT.info и переименуйте его, чтобы имя до точки совпадало с именем папки. Затем отредактируйте этот файл .info — замените STARTERKIT на имя вашей субтемы.

3. Выберите, какой дизайн нужен:

  • Резиновый: скопируйте layout-liquid.css из папки zen/zen поместите в папку вашей субтемы.
  • Фиксированный: скопируйте layout-fixed.css из папки zen/zen поместите в папку вашей субтемы.

Затем переименуйте этот файл в layout.css. Обратите внимание: в файле .info уже указан именно layout.css.

4. Скопируйте таблицу стилей версии для печати: zen/zen/print.css. Переименовывать не нужно, см. .info.

5. Скопируйте основную таблицу стилей zen/zen/zen.css и переименуйте в соответстви с именем папки вашей субтемы. В файле .info эта таблица стилей указывается в stylesheets[all][] — и там тоже должно быть указано переименованное имя файла. Например:

stylesheets[all][]   = my_zen_theme.css

6. Отредактируйте файлы template.php и theme-settings.php в папке вашей субтемы. Замените все «STARTERKIT» на имя папки вашей субтемы.

7. Авторизуйтесь в Drupal как администратор и перейдите в Administer → Site building → Themes (admin/build/themes) и активируйте вашу новую субтему.

Опционально

[ред. | ред. код]

8. Вы можете изменить все базовые таблицы стилей Zen. Для этого скопируйте соответствующие файлы .css из папки zen/zen в папку вашей субтемы и активируйте их в файле .info. Например, скопируйте zen/zen/html-elements.css в папку с вашей субтемой: my_zen_theme/html-elements.css, а затем отредактируйте my_zen_theme/my_zen_theme.info:

в строке

;stylesheets[all][]  = html-elements.css

удалите точку с запятой:

stylesheets[all][]   = html-elements.css

9. Вы можете изменить все шаблоны темы. Скопируйте нужный вам файл .tpl.php в папку с вашей субтемой. Например, скопируйте zen/zen/page.tpl.php в вашу папку my_zen_theme/page.tpl.php. Обязательно обновите кэш после этих изменений.

10. Темизация формы поисска: скопируйте search-theme-form.tpl.php из папки modules/search/ и поместите в папку вашей субтемы. Не забудьте обновить кэш Drupal.

Принципы верстки в Zen CSS

[ред. | ред. код]

Zen (основная тема)

[ред. | ред. код]

Принципы верстки CSS в Zen основаны на малодокументированном способе «Border Politics». Вебмастер может совершенно свободно применять резиновую или фиксированную верстку, используя один и тот же корректный, упорядоченный XHTML. При этом визуальное отображение элементов страницы может отличаться от порядка, зхаданного в HTML.

Основные части страницы располагаются в HTML в таком порядке:

  1. Header
  2. Content
  3. Navbar
  4. Left sidebar
  5. Right sidebar
  6. Footer

А визуальное отображение этих частей может быть таким:

  1. Header
  2. Navbar
  3. Left sidebar
  4. Content
  5. Right sidebar
  6. Footer

Благодаря тому, что блок "Content" располагается в верхней части HTML кода страницы, сразу за "Header", сделанные таким образом страницы выше ценятся поисковыми системами.

Zen Classic

[ред. | ред. код]

Тема "Zen Classic" использует резиновую или фиксированную верстку, основанную на CSS шаблоне стандартной друпаловской темы Garland (см. Jello Mold layout). В то же время Zen Classic существенно проще для модификации, чем Garland.

Другие субтемы Zen

[ред. | ред. код]

http://drupal.org/node/340837

См. также

[ред. | ред. код]