Блог Vaden Pro

Все о самостоятельном создании и продвижении сайтов

Темизация полей Drupal 7. Шаблон field.tpl.php

Раздел: 

Мы уже разобрались с тем, как подогнать под себя общий вид страницы материала в Drupal, и теперь пришло время поговорить о том, как нам доработать под себя сами поля, если у нас возникает в этом необходимость, ведь не всегда стандартный html подходит под нужды каждого проекта.

Темизация полей в Drupal

Какие существуют шаблоны для темизации полей в Drupal?

Для начала рассмотрим какой шаблон в каком случае следует подключать.

field--[тип поля].tpl.php

Применится ко ВСЕМ полям имеющим тип, указанный нами. Не следует путать тип и имя поля. Тут имеется ввиду шаблон для:

Drupal тип поля

Как мы видим, по умолчанию в админке даются только названия типов. Узнать их системные имена можно на странице перечня типов полей для Drupal.

Так, к примеру у поля с типом «Текст длинный (с анонсом)» системное имя будет text_with_summary, а название шаблона: field--text_with_summary.tpl.php

field--[название поля].tpl.php

Уже чуть более узкий шаблон, чем предыдущий. Зацепит ВСЕ поля имеющее конкретное системное имя. Пожалуй самый часто используемый шаблон, ведь обычно нам нужно чтобы конкретное поле везде имело одинаковый вид.

Посмотреть название поля можно в админке в структура/тип материала/управление полями:

Drupal название поля

Так, чтобы работать с шаблоном для поля жанр нам необходимо взять его системное имя (field_janr) и назвать шаблон field--field_janr.tpl.php.

field--[тип материала].tpl.php

Зацепит ВСЕ поля в конкретном типе материала. Весьма редко используемый шаблон, поскольку обычно мы и изменяем поля чтобы на конкретной странице каждое выводилось по-своему. Но может кому и пригодится…

Напоминаю, что системное имя типа материала можно посмотреть тут:

Drupal системное имя материала

В итоге для изменения всех полей в типе материала книга с системным именем «book» нужно использовать шаблон field--book.tpl.php

field--[название поля]--[тип материала].tpl.php

Ну и на последок самый узко специализированный шаблон, который позволяет изменять конкретное поле в конкретном типе материала.

Отлично подходит для ситуаций, когда мы не хотим задеть что-то лишнее и работаем над оформлением конкретного типа материала.

Так, чтобы работать к примеру с полем жанр из типа материала книга нам необходимо создать шаблон: field--field_janr--book.tpl.php

оказание услуг по разработке сайта.

Как подключить новый шаблон?

Начинаем с того, что скопируем стандартную болванку поля с директории ваш сайт/modules/field/theme/field.tpl.php в папку нашей темы.

После переименовываем этот файл в соответствии с нашими нуждами (смотри перечень шаблонов выше).

И последним штрихом становится очистка кеша сайта для того, чтобы Drupal увидел наш шаблон и начал воспринимать изменения вносимые в него.

Очистка кеша Drupal

После того, как мы выбрали необходимый шаблон поля и подключили его можно начинать работать.

Пример темизации поля

Итак, давайте для примера добавим симпатичные иконки возле названия жанра в типе материала книга. Как вы уже догадались, я буду использовать шаблон field--field_janr--book.tpl.php.
В начале работы код поля выглядит следующим образом:

Drupal field.tpl.php

Разберем подробно:

  • 1- Директория в которую мы поместили наш файл. Как видим он находится в папке нашей темы в templates. Почему я его закинул именно сюда я уже писал в уроке о создании своей темы.
  • 2- Комментарии к шаблону. Рекомендую их оставить. В них описаны переменные доступные для работы, что может быть очень полезно.
  • 3- Обертка поля с выводом системных классов, если хотим можем просто удалить друпаловские классы и присвоить свои, это может быть удобно при работе.
  • 4- Вывод метки поля. При необходимости можно удалить, можно убрать вывод метки из админки и присвоить свою, которая и выведется на страницу.
  • 5- Обертка для полей, можно по желанию убрать.
  • 6- Самая важная часть шаблона, собственно вывод самих значений поля. Его весьма редко приходится изменять, поскольку тут отдаются просто значения записанные в поле.

Давайте немного упростим наш код в соответствии с тем, что я описал Выше для начала работы:

Drupal код поля

И на страницу теперь выводится:

Страница сайта

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

Перед продолжением работы проверьте, что у вас установлен модуль Devel и на страницу выводятся системные сообщения сайта.

Итак, внутри цикла foreach выводим dpm($item); с целью узнать что будет у нас передано на страницу.

Drupal dpm

После этого у нас появился на странице dpm с содержимым нашего поля, мы можем использовать для дальнейшей работы как просто имя термина таксономии, воспользовавшись ['#title'], но я бы рекомендовал привязываться к tid, поскольку если имя термина будет изменено, а мы привязались к его имени, то дальнейший код работать не будет, а такое встречается часто. Привязываясь же к tid связь сохранится даже при изменении имени термина.

Drupal dpm

Итак, получим id термина таксономии в специальную переменную:

$tid = $item['#options']['entity']->tid;

Дальше, воспользовавшись условным оператором свич, в зависимости от tid присвоим новой переменной нужный нам класс.

Для удобства посмотрим тиды на странице словаря с которым работаем:

Drupal узнать tid

Наведя на изменить, мы можем посмотреть айдишник каждого термина, и после в зависимости от этого запишем свой класс в необходимую пременную и удалим наш дмп, поскольку он нам не нужен:

php swich

Подробнее описание кода:

  • 1- Получаем tid нашего термина
  • 2- Передаем его значение в условный оператор
  • 3- Каждый case проверяет соответствие того, что было передано в свич конкретному случаю и если соответствие было установлено выполняет то, что находится внутри его до оператора break.
  • 4- Записываем необходимый нам класс в переменную

Осталось вывести полученный результат в код и добавить значок при помощи CSS.

Итак, выводим в строке наш класс:

<span class="field-item <?php print $custom_class; ?>"><?php print render($item); ?></span>

Результат выполнения на странице:

Drupal темизация поля

Итоговый код, который у нас получился в нашем field--field_janr--book.tpl.php:

<div class="customJanr">
    <span class="label">Жанр произведения:</span>
    <?php
    //выводим содержимое каждого результата поля на страницу
    foreach ($items as $delta => $item):
      //получаем tid конкретного результата
      $tid = $item['#options']['entity']->tid;
      //в зависимости от tid записываем желательный класс в переменную
      switch ($tid) {
        case '3':
          $custom_class = 'fantasy';
          break;
        case '2':
          $custom_class = 'fantastic';
          break;
        case '5':
          $custom_class = 'horror';
          break;
        case '7':
          $custom_class = 'skazki';
          break;
      }
      ?>
 
      <span class="field-item <?php print $custom_class; // выводим на страницу класс?>">
        <?php print render($item); ?>
      </span>
    <?php endforeach; ?>
</div>

Подводя итоги

Вот мы и спустились еще на уровень ниже. Для тех, кто еще не понял- работая с темизацией Drupal мы словно работаем с матрешкой: field.tpl.php находится внутри node.tpl.php, node.tpl.php часть page.tpl.php, которая в свою очередь относится к html.tpl.php:

Drupal система файлов tpl.php

Понимание этого принципа позволит Вам не путаться при выборе шаблона для работы.

В дальнейших уроках курса мы рассмотрим процесс темизации тизеров, нод и еще многих полезных вещей.