xandeadx.ru Блог музицирующего веб-девелопера

Drupal → Темизация форм

Опубликовано в

Drupal 8

Пример темизации формы с идентификатором example_form:

1. Реализуем хук hook_theme(), в котором в качестве имени шаблона указываем идентификатор формы.

/**
 * Implements hook_theme().
 */
function THEMENAME_theme() {
  return [
    'example_form' => [
      'render element' => 'form',
    ],
  ];
}

2. Создаём файл example-form.html.twig, в котором выводим всё что нужно:

<form{{ attributes }}>
  <header>
    {{ form.element1 }}
    {{ form.element2 }}
  </header>
  {{ form.without('element1', 'element2') }}
</form>

3. Сбрасываем кэш.

Подробнее (пример №4).

Drupal 7

Пример темизации формы commerce_checkout_form_checkout:

1. Реализуем хук hook_theme():

function THEMENAME_theme() {
  return array(
    'commerce_checkout_form_checkout' => array(
      'render element' => 'form',
      'template' => 'commerce-checkout-form-checkout',
    ),
  );
}

2. Создаём файл commerce-checkout-form-checkout.tpl.php:

<div class="row">
  <div class="col">
    <?php echo render($form['field_name1']); ?>
    <?php echo render($form['field_name2']); ?>
  </div>
  <div class="col">
    <?php echo render($form['field_name3']); ?>
  </div>
</div>
<?php echo drupal_render_children($form); ?>

3. Очищаем кэш.

Написанное актуально для Drupal 7
Похожие записи

Комментарии RSS

Аватар пользователя Виктория
Виктория, #

Может, мой вопрос покажется глупым, но где при этом должен находится файл commerce-checkout-form-checkout.tpl.php?

Аватар пользователя xandeadx
xandeadx, #

там же где файл с реализацией hook_theme

Аватар пользователя Роман
Роман, #

Не могу понять как темизировать имеено поля
например должно получиться так

<div class="search-item">
<div class="form-field__title active">Имя</div>
<input class="form-field" type="text">
</div>

Это выводит дурпал7

<div class="search-item">
	<div class="form-field__title active">Имя</div>
    <div class="form-item form-type-textfield form-item-title">
  <label for="edit-title">Имя <span class="form-required" title="Это поле обязательно для заполнения.">*</span></label>
 <input type="text" id="edit-title" name="title" value="" size="60" maxlength="255" class="form-field required">
</div>
</div>

Аватар пользователя xandeadx
xandeadx, #

theme_form_element

Аватар пользователя Роман
Роман, #

А к input так и не получается добавить определенный класс :(

Аватар пользователя Гость
Гость, #

Что значит "реализуем хук"?

Оставить комментарий

Содержимое этого поля является приватным и не будет отображаться публично. Если у вас есть аккаунт в Gravatar, привязанный к этому e-mail адресу, то он будет использован для отображения аватара.
  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
  • Доступные HTML теги: <a> <i> <b> <strong> <code> <ul> <ol> <li> <blockquote> <em> <s>
  • Строки и параграфы переносятся автоматически.
  • Подсветка кода осуществляется с помощью тегов: <code>, <css>, <html>, <ini>, <javascript>, <sql>, <php>. Поддерживаемые стили выделения кода: <foo>, [foo].

Подробнее о форматировании