0,0
рейтинг
5 марта 2010 в 11:47

Разработка → Создаём тему для 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.

Успехов в создании тем!
Николай Васильчук @Anonym
карма
6,5
рейтинг 0,0
Реклама помогает поддерживать и развивать наши сервисы

Подробнее
Реклама

Самое читаемое Разработка

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

  • НЛО прилетело и опубликовало эту надпись здесь
  • 0
    Да, хорошие статьи. Работаю с Joomla/Joostina, но так же сейчас буду осваивать и Drupal.
    Добавил в избранное себе, спасибо.
  • 0
    Кстати, раз уж упоминаете ZEN, объясните простому нубу — почему бы просто ZEN и не использовать в качестве основы для своей темы? В чем принципиальное отличие вашего варианта? ZEN, как ни крути, уже законченное решение — кучу всего можно сделать вообще не трогая сами шаблоны, а тупо через CSS. Ну и вообще — работаешь с одной стороны не с совсем голым листом, а с другой — не надо ничего именно переделывать — только дополнять большей частью. Ну а это уж проблем не доставляет — це ж Друпал…
    • 0
      Давно делаю темы на ZEN. Надоело каждый раз вычищать лишние стили и другие «фишки» родительской темы. Наконец то добрался и сделал идеальный (для меня, конечно же) шаблон темы отвязанной от ZEN. Мне было необходимо выделить шапку с подвалом в отдельные шаблоны и обрабатывать отдельно каждый регион. К тому же, такая структура темы как у меня, мне кажется, более удобна и наглядна. Ну и плюс — не надо таскать с собой родительскую тему.
      • 0
        Мммм… А что именно вы там вычищаете? Там, по-моему, кроме меню и табов и вычищать-то нечего.
        Опять же — может быть стоило в целях расширяемости и т.п. оформить вашу тему в качестве подтемы ZEN? Чтобы и все фишки ZEN остались и все, что вы пишите — про отдельные файлы и т.п.
        • 0
          Практически всё что я тут изложил позаимствовано из темы ZEN, переделано и улучшено. Что такого вы в ней нашли? Я не вижу особых бонусов в дочерних темах.
          • +3
            Я понял вашу позицию. :-) Спасибо.
      • 0
        Тогда уж присмотреться к теме basic. Она является «вычищенным вариантом» zen, регулярно обновляется, уже есть RC для drupal7, поддерживает skinr и прочие приятности…
  • 0
    Осталось в себе креативность работы развить) остальное уже понятно
  • 0
    Забыли сказать как заставить Drupal увидел изменения в info для темы.
    Хотя, о вариантах темизации в Drupal можно писать бесконечно, сколько разработчиков, столько и вариантов будет :).
    • 0
      info как и template.php кэшируются. Чтобы друпал увидел изменения, надо почистить кэш.
      • 0
        ;) нужно обновить реестр тем /admin/build/themes/select просто зайти и пересохранить его, или дернуть через API
  • –1
    Впервые слышу про
    header.tpl.php
  • 0
    забыли про очень важную переменную $closure.
    • –1
      Очень важная переменная $closure определяет регион под футером, если мне память не изменяет. У меня в теме её нет.
      • +1
        То есть данные, записываемые в неё, у вас нигде не выводятся или записываются в другую переменную?
        Просто для примера, могу сказать, что если не сделать вывод $closure в page.tpl.php, то не будут работать как минимум два модуля: Administration menu и FCKeditor.
        • –1
          admin_menu и ckeditor работают, не волнуйтесь =) Если хотите, добавьте $closure в page.tpl.php
        • 0
          Спасибо, исправлю. В $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
            не знаю как у вас, но я долго бился со статистикой от googla по конверcии магазина ubercart, пока не поставил этот closure в тему.
            • 0
              Вы не поверите. И у меня $closure тоже нужен.
  • 0
    В том и минус малообкатанных тем, косяки в них вылазят с некоторыми модулями…

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

    В общем нафиг-нафиг, теперь только Zen, тем более его отвязать от родительской темы легче легкого, и css использовать можно только свои, без его зоопарка :)
  • 0
    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
      А что мешает дополнительные настройки для своей темы сделать?
      • 0
        если достаточно настроек от zen, то и велосипед изобретать не надо.
        если надо добавить свои, то их очень просто добавить (см. $form['MYTHEME_example']).
        • 0
          Я писал шаблон для создания тем в будущем. Мне половины стандартных настроек то не надо, не говоря уж о других. Вы можете использовать приведенный мной код на свой вкус. Повторюсь, я ставил цель не использовать родительские темы, я ставил цель сделать гибкую свою автономную тему. А что использовать — ваш выбор.
          • 0
            Мне половины стандартных настроек то не надо

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

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

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

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