Оформление формы поиска в Drupal

В последнее время занимаюсь версткой тем для Drupal 5.7. Хочу поделиться способом, с помощью которого я оформила формы поиска (ну и, само собой, увековечить для себя).

Что нужно:

  1. Полностью графическая форма: поле и кнопка в виде изображений.
  2. Надписи на кнопке быть не должно ни в одном браузере.
  3. В поле поиска уже вставлено слово (в нашем случае "Поиск...").
  4. Чтобы при нажатии на кнопку все работало, а не открывалась белая страница.

Сначала переопределим функцию вывода формы в файле темы template.php:

<?php
/*
* Переопределение формы поиска
*/
function phptemplate_search_theme_form($form) {
 
$form['search_theme_form_keys']['#value'] = 'Поиск...';
 
$form['submit']['#theme'] = 'button';
 
$form['submit']['#button_type'] = 'image';
 
$form['submit']['#value'] = '';
 
$form['submit']['#attributes'] = array(
/*К сожалению, атрибут scr я не смогла заставить работать, то есть строчка ниже написана просто для порядка, но не для работы*/
   
'src' => base_path() . path_to_theme() . '/images/but-search.png',
   
'alt' => t("search"),
   
'title' => t("Нажмите чтобы начать поиск")
  );
  return
'<div id="search" class="container-inline">'. drupal_render($form) .'</div>';
}
?>

Хочу рассказать, как я нашла этот код и как догадалась его поменять для своих целей.
Сначала был поиск. Чтение drupal.org и drupal.ru. Я поняла что дело надо будет иметь с функцией phptemplate_search_theme_form и так как вставка кода с этих сайтов убирала стили, которые я определила для своей формы, я решила найти первоисточник, а наибыстрейший способ сделать это - пойти на http://api.drupal.org/ и набрать в поле поиска интересующую функцию. Так я вышла на страницу http://api.drupal.org/api/function/theme_search_theme_form/5, и все стало ясно - сниппеты, которые я вставляла в template.php, не содержали <div id="search" class="container-inline">, поэтому мои стили не подходили для них.

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

$form['submit']['#button_type'] = 'image';

определяет тип кнопки для поля с именем (name) submit. Тогда чтобы мне переопределить value для моего поля с именем search_theme_form_keys, нужно добавить строку

$form['search_theme_form_keys']['#value'] = 'Поиск...';

Вот так я докопалась до истины. Теперь у меня есть опыт в переопределении вывода форм в Drupal!

Теперь самое интересное - стили CSS.

Эти стили определяют форму, у которой поле и кнопка соединены вместе и визуально кнопка - продолжение поля.

А вот стили для кнопки, находящейся отдельно от текстового поля:

На всякий случай, если стили не работают в IE - нужно убрать все русские комментарии из CSS файла.

Вот и все. Когда сайты будут готовы, я дам ссылки на просмотр этих форм вживую)))

Гость

Молодца, доступно понятно и на личном опыте. РЕСПЕКТ Подмигивающий

Гость

Отлично!!! Мне помогло для 5-ой версии, вот еще бы для 6-ой найти...

Гость

М-да!
Вот который день уже мучаюсь со смещением кнопки поиск в меню. Нужно сместить вправо. Далее как тут написано: убрать лишнее.
http://www.drupal.ru/node/34134#comment-181909

sa_bo_nim

Нашла очень хороший рецепт (делает именно input type="image") для Drupal6 здесь

Татьяна

Подскажите, пожалуйста, как сделать чтоб форма поиска отображалась в одной строке с меню, как у вас на этом сайте? У меня Друпал 6.

sa_bo_nim

Татьяна, тут дело в верстке. Вам нужно выровнять меню по левому краю блока, а форму поиска - по правому.

Привожу кусок из page.tpl.php, выводящий серый блок на данном сайте:

<div id="navigation" class="menu <?php if ($primary_links) { print "withprimary"; } if ($secondary_links) { print " withsecondary"; } ?> ">
  <?php if ($search_box): print $search_box; endif; ?>
  <?php if ($primary_links): ?>
  <div id="primary" class="clear-block">
    <?php print theme('links', $primary_links); ?>
  </div>
  <?php endif; ?>
</div> <!-- /navigation -->
Kobalerro

Подскажите пожалуйста! Возникла проблема с переопределением стиля для кнопки поиска. Используется стандартный поиск drupal. Текстовое поле берёт стиль с шаблона а кнопка отказываеться. Перепробовал кучу вариантов и ничего.