Темизация форм Drupal 7 на примере формы поиска
В общем случае для темизации любой формы в Drupal используется функция form_alter. Для темизации какой либо формы нам понадобится её form_id. Узнать его можно открыв исходный текст страницы (лучше воспользоваться помощью плагина web разработчика, например, firebug для firefox) и посмотреть на скрытый input с именем form_id.
Давайте темизируем форму поиска данного сайта. Вот так выглядит код формы:
<form accept-charset="UTF-8" id="search-block-form" method="post" action="/">
<div>
<div class="container-inline">
<h2 class="element-invisible">Форма поиска</h2>
<div class="form-item form-type-textfield form-item-search-block-form">
<label for="edit-search-block-form--2" class="element-invisible">Поиск</label>
<input type="text" class="form-text" maxlength="128" size="15" value="" name="search_block_form"id="edit-search-block-form--2" title="Введите ключевые слова для поиска."></div>
<div id="edit-actions" class="form-actions form-wrapper">
<input type="submit" class="form-submit" value="Поиск" name="op" id="edit-submit"></div>
<input type="hidden" value="form-7iPTPnE_tH1QZ7h7POH-QEcIhAbyAwlVMgjtz3Svf3A" name="form_build_id">
<input type="hidden" value="search_block_form" name="form_id"></div>
</div>
</form>В самом низу мы видим значение form_id — search_block_form — это и есть искомое нами имя формы.
Далее приступаем к темизации. Вписываем в файл template.php следующий код. Здесь мы проверяем, что id формы равно search_block_form и только затем темизируем её.
function имя_темы_form_alter(&$form, &$form_state, $form_id) {
if ($form_id == 'search_block_form') {
$form['search_block_form']['#title'] = t('Search'); // Меняем текст заголовка
$form['search_block_form']['#title_display'] = 'invisible'; // Выключаем отображение заголовка
$form['search_block_form']['#size'] = 20; // Задаем размер поля ввода
$form['actions']['submit']['#value'] = t('GO!'); // Меняем текст кнопки поиска
$form['search_block_form']['#class'] = 'search-form'; // CSS-class текстового поля
$form['actions']['submit'] = array('#type' => 'image_button', '#src' => base_path() . path_to_theme() .'/images/searchbutton.png'); // Путь к картинке кнопки, если мы хотим заменить текст на картинку
$searchtext = 'Search'; // Задаем текст внутри поля. Здесь я использую английское значение, его можно легко перевести в админке. Можно писать и по-русски. Помещаем его в переменную, чтобы было удобно с ним работать
$form['search_block_form']['#default_value'] = t($searchtext);
// Добавляем дополнительные атрибуты к текстовому полю. Убирает текст при наведении курсора в форму и возвращает его назад
$form['search_block_form']['#attributes']['onblur'] = "if (this.value == '') {this.value = '" . t($searchtext)."';}";
$form['search_block_form']['#attributes']['onfocus'] = "if (this.value == '" . t($searchtext) . "') {this.value = '';}";
// Предотвращает от поиска текста по умолчанию
$form['#attributes']['onsubmit'] = "if(this.search_block_form.value=='" . t($searchtext) . "'){ alert('" .t('Please enter a search') . "'); return false; }";
// Альтернативный (HTML5) атрибут, вместо использования javascript
$form['search_block_form']['#attributes']['placeholder'] = t($searchtext);
}
}Так же можно темизировать конкретную форму, обращаясь к ней непосредственно. Здесь нам уже не нужно проверять, что id формы равно 'search_block_form', поэтому обертку if ($form_id == 'search_block_form') { } убираем полностью, оставляя только код
function имя_темы_form_search_block_form_alter(&$form, &$form_state) {
}