Блог Vaden Pro

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

Темизация комментариев Drupal. Шаблоны comment-wrapper.tpl.php, comment.tpl.php, comment-form.tpl.php

Дата:28.07.15 в 14:47
Раздел: 

Стандартная форма комментариев в Drupal к сожалению не может нас порадовать гибкостью настроек из админки и удобством кода, но все возможно изменить.

Темизация комментариев Drupal

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

comment-wrapper.tpl.php

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

Содержимое файла

Для подключения достаточно скопировать шаблон с директории Ваш сайт/ modules/comment/comment-wrapper.tpl.php в папку нашей темы и очистить кеш, чтобы Drupal его увидел.

Drupal comment-wrapper.tpl.php

Рассмотрим содержимое этого файла подробнее:

  • 1- Обертка комментариев с выводом стандартных классов Drupal
  • 2- Проверка есть ли на странице материала комментарии и не является ли страница страницей форума, если все ок содержимое этого ифа будет введено на страницу
  • 3- Заглавие, которое будет выведено на страницу над комментариями. Тут мы можем при необходимости как изменить/убрать его так и изменить его обертку
  • 4- Вывод самих комментариев оставленных пользователями
  • 5- Вывод заглавия формы добавления комментариев
  • 6- Вывод самой формы комментариев

Пример темизации

Сейчас наши комментарии выглядят вот так:

Drupal комментарии

Давайте немного упростим этот шаблон для себя, изменим заголовки с комментариев на отзывы и выведем форму над комментариями, чтобы человеку было удобнее оставлять отзыв. Теперь наш код выглядит вот так:

Drupal comments

А на странице все отображается следующим образом:

Drupal комментарии

comment.tpl.php

Содержимое файла

Итак, мы уже расположили содержимое на странице в желаемом порядке, теперь приведем в порядок сами комментарии. Для этого используется шаблон comment.tpl.php, который мы копируем в тему с ваш сайт/modules/comment/comment.tpl.php.

Здесь уже больше простора для работы. Описание переменных с которыми мы можем работать в шаблоне как обычно дано в начале файла в комментариях и исходно код шалона выглядит следующим образом:

Drupal comment.tpl.php

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

  • 1- Обертка комментария со стандартными друпаловскими классами
  • 2- Вывод аватара пользователя, если он у него есть
  • 3- Вывод надписи, что комментарий новый можно спокойно удалить
  • 4- Вывод темы комментария
  • 5- Вывод ссылки на комментарий и стандартной подписи автора
  • 6- Обертка самого его текста
  • 7- Вывод содержимого на страницу
  • 8- Вывод подписи пользователя если она есть
  • 9- Ссылки для ответа/редактирования комментария, показываются в зависимости от прав пользователя

Пример темизации

Итак, предположим я хочу убрать из вывода тему комментария (из формы я ее уберу далее), убрать подсветку того, что комментарий новый, вывести имя автора под его аватаром (аватар я добавлю просто пользователю по умолчанию), сделать обертки для аватара с ником пользователя и остального содержимого комментария, чтобы ничего не плыло при работе. над комментарием вывести дату его создания в удобном для меня виде.

Для начала подчистим шаблон, добавим нужные нам обертки и парой строк CSS расположим элементы в комментарии как нам нужно. Итак, код после чистки:

Drupal comment

Внешний вид комментария:

Комментарий

Уже лучше, теперь нужно добавить желательные для вывода элементы в шаблон.

Поднявшись вверх, в комментарии нашего шаблона увидим, что информация о авторе хранится в переменной $author, выведем его на страницу строкой:

<?php print $author; ?>

Из того же шаблона узнаем, что информация о дате публикации хранится в переменной $created. Строка кода которой мы выведем дату:

<div class="date"><?php print $created; ?></div>

В итоге наш комментарий выглядит следующим образом:

Комментарий

Код шаблона комментария после наших манипуляций:

<div class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>>
 
    <div class="leftComment">
        <?php print $picture; ?>
        <?php print $author; ?>
    </div>
 
    <div class="rightComment">
        <div class="date"><?php print $created; ?></div>
        <div class="content"<?php print $content_attributes; ?>>
            <?php
            hide($content['links']);
            print render($content);
            ?>
        </div>
        <?php print render($content['links']) ?>
    </div>
 
</div>

Темизация формы комментариев

Итак, сами комметарии и общий вид блока в котором они выводятся мы уже привели в порядок, осталась сама форма комментариев.

Изменять ее можно как из файлика template.php, так и из собственного модуля при помощи хука. Поговорим о этих способах предметнее.

Сейчас наша форма выглядит так:

Drupal форма комментариев

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

Drupal убрать тему комментария

В отличие от самих комментариев, у формы по-умолчанию нету своего шаблона tpl.php, потому нам необходимо его подключить.

Подключение comment-form.tpl.php

Заходим в файл template.php и добавляем туда этот код:

//подключаем файлы .tpl.php для форм
function [название темы]_theme() {
  $items = array();
  //указываем к какой форме обращаемся
  $items['comment_form'] = array(
    'render element' => 'comment_form',
    //указываем путь к шаблону
    'path' => drupal_get_path('theme', '[название темы]') . '/templates',
    //указываем название шаблона
    'template' => 'comment-form',
  );
  return $items;
}

В моем случае вышло:

Drupal подключение comment-form.tpl.php

Содержимое файла comment-form.tpl.php по-умолчанию:

<?php
print drupal_render_children($comment_form);

Для дальнейшей работы с формой проверьте, что у Вас установлен модуль Devel.

Пример темизации

Давайте уберем из вывода информацию о формате текста, скроем кнопку предосмотра, уберем имя пользователя. Добавим plaseholder в поля формы, заменим текст кнопки сохранить на «Оставить отзыв».

Итак, как многие уже могли догадаться, начнем мы с dpm($comment_form); вставленным в наш шаблон перед строкой print drupal_render_children($comment_form);.

dpm

В итоге на странице увидим:

Drupal dpm form

Отсюда и будем брать информацию для дальнейшей работы.

Начнем с того, что спустимся в dpm до actions, найдем нужный нам элемент- кнопку превью, и двойным кликом выведем и после скопируем нужную нам для работы информацию:

Drupal dpm

После строкой

hide($comment_form['actions']['preview']);

Уберем из вывода кнопку превью.

Следующим шагом откроем кнопку submit и изменим текст в ней с сохранить на оставить отзыв:

dpm

$comment_form['actions']['submit']['#value'] = 'Оставить отзыв';

Для того, чтобы убрать информацию о форматах текста найдем в dpm comment_body, в нем und, там 0, и в нем необходимую нам информацию:

dpm

И строкой уберем ее из вывода:

hide($comment_form['comment_body'][LANGUAGE_NONE][0]['format']);

Как вы моги заметить мы заменили ['und'] на [LANGUAGE_NONE] это сделано чтобы в дальнейшем при разработке сайта случайно не вылезли проблемы с кодом.

Теперь аналогичным образом найдем вывод метки у поля и изменим его на none:

$comment_form['comment_body'][LANGUAGE_NONE][0]['value']['#title_display'] = 'none';

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

dpm

Для скрытия автора нам подойдет

hide($comment_form['author']);

А чтобы добавить плейсхолдер полю:

$comment_form['comment_body'][LANGUAGE_NONE][0]['value']['#attributes']['placeholder'] = t('Текст отзыва');

Функция t() дает нам возможность получить доступ к этому тексту из админки и при необходимости воспользоваться переводом этой строки. На обычном проекте без мультиязыности записи t('Текст отзыва') и 'Текст отзыва' будут работать идентично.

Теперь можно удалить из файла наш dpm.

Ну вот и все, теперь наша форма выглядит следующим образом:

Drupal comment form

Итоговый код нашего файла comment-form.tpl.php:

<?php
//скроем кнопку превью
hide($comment_form['actions']['preview']);
//изменим текст кнопки сохранить
$comment_form['actions']['submit']['#value'] = 'Оставить отзыв';
//скроем информацию о форматах текста
hide($comment_form['comment_body'][LANGUAGE_NONE][0]['format']);
//скроем метку поля комментария
$comment_form['comment_body'][LANGUAGE_NONE][0]['value']['#title_display'] = 'none';
//скроем автора
hide($comment_form['author']);
//добавим полю комментария плейсхолдер
$comment_form['comment_body'][LANGUAGE_NONE][0]['value']['#attributes']['placeholder'] = t('Текст отзыва'); 
print drupal_render_children($comment_form);

Немного поизучав структуру формы при помощи dpm, подобавляв и поубирав из нее поля через админку (структура/тип материала/управление полями комментария), поработав с формой через файл comment-form.tpl.php при помощи базовых приемов, которые я описывал в статье про темизацию ноды можно превратить эту форму именно в то, что Вам необходимо.

hook_form_alter

При помощи этого хука можно достучаться до любой формы нашего сайта и заточить ее под себя.

Пишется он в файлике созданного нами модуля. И зная основы PHP при понимании как работать с dpm() Вы без особых проблем сможете подогнать при помощи него форму под себя без подключения файла comment-form.tpl.php.

Шаблон для начала работы выглядит следующим образом:

function [название модуля]_form_alter(&$form, $form_state, $form_id) {
        if ($form_id == 'comment_form') {
          //код для изменений формы
        }
      }

Подробно на этом способе мы останавливаться не будем, поскольку это уже тематика для курса по работе с Drupal form API.

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

В уроке мы затронули вопросы создания своего шаблона для формы комментариев в Drupal, рассмотрели доступные способы работы и структуру всех файлов имеющих отношение к стандартным комментариям Drupal.

В итоге наши комментарии теперь выглядят следующим образом:

Drupal comments

Чуть CSS, подстраиваем шаблон под себя и наслаждаемся.

Как уже могли заметить те, кто проходит эту главу курса с начала, приемы для работы с разными шаблонами одни и те же. Так что не пугаемся разнообразия шаблонов и обилия информации. Все очень просто если понять что в каком бы шаблоне мы ни были, по-факту делаем мы везде одно и тоже.

Оценок: 11 (средняя 5 из 5)

Оценка: 
Ключевые слова: 
Понравилась статья? Расскажите о ней друзьям:

Курсы по Drupal (в открытом доступе)