Drupal

индекс
142,25

Создаём тему для Drupal. Часть 3

image
Часть 1, Часть 2

Шаблоны


Шаблоны мы будем складывать в sites/all/themes/mytheme/templates. Создадим шаблоны page.tpl.php — для страниц, node.tpl.php — для контента, block.tpl.php — для блоков, comment-wrapper.tpl.php — для блока с комментариями, comment.tpl.php — для одного комментария, header.tpl.php — для шапки, footer.tpl.php — для подвала, region.tpl.php — для регионов. Также, по аналогии с препроцессами, мы можем создавать файлы типа node-story.tpl.php для отображения материала типа story или block-user.tpl.php для блока user. Это позволяет темизировать отдельно разные типы содержимого сайта.

Не буду приводить HTML шаблонов. Верстайте на свой вкус. Расскажу лишь о переменных, доступных для каждого шаблона.

page.tpl.php


Основной шаблон для страницы.
Доступные переменные:
  • $head_title — заголовок страницы
  • $head — вся информация в head
  • $styles — стили
  • $scripts — скрипты
  • $classes — классы для body
  • $header — шапка, которую мы вынесли в отдельный шаблон
  • $REGION_NAME — переменные с именами регионов
  • $messages — системные сообщения
  • $tabs — табы
  • $content — контент
  • $feed_icons — иконки RSS
  • $footer — подвал, который мы вынесли в отдельный шаблон
  • $base_path — базовый путь сайта
  • $is_front — главная страница или нет
  • $logged_in — залогинен ли пользователь
  • $is_admin — админ или нет
  • $language — объект, содержащий данные о текущем языке
  • $node — нода
  • $front_page — ссылка на главную
  • $logo — логотип
  • $site_name — имя сайта
  • $site_slogan — слоган сайта
  • $mission — миссия сайта
  • $search_box — блок поиска
  • $closure — переменная вставляется перед закрывающим тэгом /body, в неё некоторые модули пишут скрипты. Спасибо хабраюзеру juliv


node.tpl.php


Шаблон вывода контента.
Доступные переменные:
  • $node — объект ноды
  • $classes — классы для ноды
  • $user_picture — аватар пользователя
  • $picture — картинка ноды, переопределяется модулями
  • $page — страница ноды или список тизеров
  • $unpublished — опубликована или нет
  • $display_submitted — кем и когда опубликована
  • $terms — категории
  • $content — контент
  • $links — ссылки
  • $title — заголовок
  • $date — дата создания
  • $name — имя автора
  • $node_url — ссылка на ноду
  • $comment_count — количество комментов
  • $type — тип материала
  • $uid — id автора
  • $zebra — класс для зебры
  • $teaser — тизер или целая нода
  • $sticky — прилеплена или нет
  • $status — статус ноды
  • $comment — включены ли комменты
  • $is_front — на главной или нет
  • $logged_in — залогинен или нет
  • $is_admin — админ или нет


region.tpl.php


Шаблон вывода региона.
Доступные переменные:
  • $classes — классы для региона
  • $content — контент
  • $region — название региона
  • $is_front — на главной или нет
  • $logged_in — залогинен или нет
  • $is_admin — админ или нет


block.tpl.php


Шаблон вывода блока.
Доступные переменные:
  • $block — объект блока
  • $classes — классы блока
  • $title — заголовок
  • $content — контент
  • $edit_links — ссылки редактирования блока
  • $zebra — зебра
  • $block_id — id блока
  • $is_front — на главной или нет
  • $logged_in — залогинен или нет
  • $is_admin — админ или нет


comment-wrapper.tpl.php


Шаблон блока вывода комментариев.
Доступные переменные:
  • $classes — классы
  • $node — нода
  • $content — контент
  • $display_mode — способ отображения комментов
  • $display_order — порядок отображения комментов
  • $comment_controls_state — есть ли форма управления комментамми


comment.tpl.php


Шаблон отображения одного комментария.
Доступные переменные:
  • $classes — классы
  • $picture — аватар автора
  • $title — заголовок
  • $new — новый или нет
  • $unpublished — опубликован или нет
  • $author — автор
  • $created — дата создания
  • $content — контент
  • $links — ссылки


header.tpl.php


Шаблон шапки сайта. Все переменные для этого шаблона мы определили сами в preprocess-header.inc
Доступные переменные:
  • $front_page — главная страница или нет
  • $logo — логотип сайта
  • $search_box — блок поиска
  • $header_line — регион с именем header_line


footer.tpl.php


Шаблон подвала сайта. Все переменные для этого шаблона мы определили сами в preprocess-footer.inc
Доступные переменные:
  • $footer_line — регион с именем footer_line
  • $page_bottom — регион с именем page_bottom


Что в итоге


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

Откуда это


Большая часть информации и идей взята из тем ZEN и SKY.

Успехов в создании тем!
+33
5 марта 2010, 11:47
163

комментарии (38)

НЛО прилетело и опубликовало эту надпись здесь
0
gloomkolomna #
Да, хорошие статьи. Работаю с Joomla/Joostina, но так же сейчас буду осваивать и Drupal.
Добавил в избранное себе, спасибо.
0
sky_lord #
Кстати, раз уж упоминаете ZEN, объясните простому нубу — почему бы просто ZEN и не использовать в качестве основы для своей темы? В чем принципиальное отличие вашего варианта? ZEN, как ни крути, уже законченное решение — кучу всего можно сделать вообще не трогая сами шаблоны, а тупо через CSS. Ну и вообще — работаешь с одной стороны не с совсем голым листом, а с другой — не надо ничего именно переделывать — только дополнять большей частью. Ну а это уж проблем не доставляет — це ж Друпал…
0
Anonym #
Давно делаю темы на ZEN. Надоело каждый раз вычищать лишние стили и другие «фишки» родительской темы. Наконец то добрался и сделал идеальный (для меня, конечно же) шаблон темы отвязанной от ZEN. Мне было необходимо выделить шапку с подвалом в отдельные шаблоны и обрабатывать отдельно каждый регион. К тому же, такая структура темы как у меня, мне кажется, более удобна и наглядна. Ну и плюс — не надо таскать с собой родительскую тему.
0
sky_lord #
Мммм… А что именно вы там вычищаете? Там, по-моему, кроме меню и табов и вычищать-то нечего.
Опять же — может быть стоило в целях расширяемости и т.п. оформить вашу тему в качестве подтемы ZEN? Чтобы и все фишки ZEN остались и все, что вы пишите — про отдельные файлы и т.п.
0
Anonym #
Практически всё что я тут изложил позаимствовано из темы ZEN, переделано и улучшено. Что такого вы в ней нашли? Я не вижу особых бонусов в дочерних темах.
+3
sky_lord #
Я понял вашу позицию. :-) Спасибо.
0
adubovskoy #
Тогда уж присмотреться к теме basic. Она является «вычищенным вариантом» zen, регулярно обновляется, уже есть RC для drupal7, поддерживает skinr и прочие приятности…
0
Rodman #
Осталось в себе креативность работы развить) остальное уже понятно
0
pvasili #
Забыли сказать как заставить Drupal увидел изменения в info для темы.
Хотя, о вариантах темизации в Drupal можно писать бесконечно, сколько разработчиков, столько и вариантов будет :).
0
Anonym #
info как и template.php кэшируются. Чтобы друпал увидел изменения, надо почистить кэш.
0
pvasili #
;) нужно обновить реестр тем /admin/build/themes/select просто зайти и пересохранить его, или дернуть через API
–1
Cranberry #
Впервые слышу про
header.tpl.php
0
juliv #
забыли про очень важную переменную $closure.
–1
Anonym #
Очень важная переменная $closure определяет регион под футером, если мне память не изменяет. У меня в теме её нет.
+1
juliv #
То есть данные, записываемые в неё, у вас нигде не выводятся или записываются в другую переменную?
Просто для примера, могу сказать, что если не сделать вывод $closure в page.tpl.php, то не будут работать как минимум два модуля: Administration menu и FCKeditor.
–1
Anonym #
admin_menu и ckeditor работают, не волнуйтесь =) Если хотите, добавьте $closure в page.tpl.php
0
Anonym #
Спасибо, исправлю. В $closure некоторые модули добавляют скрипты.
* — $closure: Final closing markup from any modules that have altered the page.
* This variable should always be output last, after all other dynamic content.
0
shtrlz #
не знаю как у вас, но я долго бился со статистикой от googla по конверcии магазина ubercart, пока не поставил этот closure в тему.
0
Anonym #
Вы не поверите. И у меня $closure тоже нужен.
0
Pendalf #
В том и минус малообкатанных тем, косяки в них вылазят с некоторыми модулями…

Я одно время игрался с генезисом, так там модуль аякс-комментариев не работал, в теме АТСК не хватало стандартный переменных и т.д…

В общем нафиг-нафиг, теперь только Zen, тем более его отвязать от родительской темы легче легкого, и css использовать можно только свои, без его зоопарка :)
0
brmn #
zen можно использовать еще вот так:

MYTHEME.info
...

base theme = zen 

  ; Set the default settings to be used in theme-settings.php
settings[zen_block_editing]        = 1
settings[zen_breadcrumb]           = yes
settings[zen_breadcrumb_separator] = ' › '
settings[zen_breadcrumb_home]      = 1
settings[zen_breadcrumb_trailing]  = 1
settings[zen_breadcrumb_title]     = 0
settings[zen_rebuild_registry]     = 1
settings[zen_wireframes]           = 0

...


theme-settings.php
<?php
// $Id: theme-settings.php,v 1.7 2008/09/11 09:36:50 johnalbin Exp $

// Include the definition of zen_settings() and zen_theme_get_default_settings().
include_once './' . drupal_get_path('theme', 'zen') . '/theme-settings.php';


/**
 * Implementation of THEMEHOOK_settings() function.
 *
 * @param $saved_settings
 *   An array of saved settings for this theme.
 * @return
 *   A form array.
 */
function MYTHEME_settings($saved_settings) {

  // Get the default values from the .info file.
  $defaults = zen_theme_get_default_settings('MYTHEME');

  // Merge the saved variables and their default values.
  $settings = array_merge($defaults, $saved_settings);

  /*
   * Create the form using Forms API: http://api.drupal.org/api/6
   */
  $form = array();
  /* -- Delete this line if you want to use this setting
  $form['MYTHEME_example'] = array(
    '#type'          => 'checkbox',
    '#title'         => t('Use this sample setting'),
    '#default_value' => $settings['MYTHEME_example'],
    '#description'   => t("This option doesn't do anything; it's just an example."),
  );
  // */

  // Add the base theme's settings.
  $form += zen_settings($saved_settings, $defaults);

  // Remove some of the base theme's settings.
  unset($form['themedev']['zen_layout']); // We don't need to select the base stylesheet.

  // Return the form
  return $form;
}


в результате имеете дополнительные настройки темы от zen
0
Anonym #
А что мешает дополнительные настройки для своей темы сделать?
0
brmn #
если достаточно настроек от zen, то и велосипед изобретать не надо.
если надо добавить свои, то их очень просто добавить (см. $form['MYTHEME_example']).
0
Anonym #
Я писал шаблон для создания тем в будущем. Мне половины стандартных настроек то не надо, не говоря уж о других. Вы можете использовать приведенный мной код на свой вкус. Повторюсь, я ставил цель не использовать родительские темы, я ставил цель сделать гибкую свою автономную тему. А что использовать — ваш выбор.
0
brmn #
Мне половины стандартных настроек то не надо

я ставил цель сделать гибкую свою автономную тему

Как-то не вяжется ;)
0
Anonym #
А вы статью читали? Там в конце написано в чём гибкость
+1
brmn #
Я Вас понял.
Удачи ;)
0
Anonym #
Тема ZEN бесспорно хороша, просто цель была другая.
+1
Bully #
Есть достаточно хорошая книга на тему разработки тем :):
Drupal 6 Themes (Packt)

pdf'ник гуглится достаточно быстро.
0
Anonym #
Спасибо, почитаю на досуге.
0
insaner #
Отличный материал для начинающих, но ваш вариант темизации отказался работать. В частности те самые header и footer не отображают содержимое в шаблоне page.tpl.php. Возможно я делаю что то не так, хотя все достаточно очевидно. Может есть какие то особые параметры, которые необходимо задать?
0
Guedda #
Спасибо огромное за статью. Только есть один вопросец. Как можно вытащить картинки из той папки images, которую мы создали в sites/all/mytheme/images/?
0
Anonym #
В статье она помоему фигурирует только один раз в info файле. В остальном я использую картинки из CSS, так что смело можете кидать их куда угодно.
0
kiev #
есть шаблон для вывода определенного типа данных — в какую директорию его поместить что бы все темы его видели, надо для мультисайтовой инсталяции друпала
0
Anonym #
Поместите его в каждую тему либо создайте свой модуль и пропишите в нем шаблон.
0
zakranton #
В header.tpl.php переменная $front_page — выдает адрес главной страницы, что бы определить главная или нет в preprocess-page.inc в переменных для шапки определил $is_front. Плюс для удобства определил $head_title,
$head, $styles, $scripts.
0
s_IP #
Хороший пост. Может кто подскажет еще как вывести искомую строку. Не могу найти переменную. Количество результатов @count, а вот переменную самой стоки какую ищу не могу найти.

Только зарегистрированные пользователи могут оставлять комментарии. Войдите, пожалуйста.