Drupal 7 で検索フォームを Font Awesome 風に変える方法
Drupal のデフォルトの検索フォームのボタンを Font Awesome のものにスタイル変更する方法について。
Drupal に Font Awesome を導入するには、「そのまま Font Awesome を自作のテーマに含めて使う方法」と「専用のコントリビュートモジュールを使う方法」の 2 つの方法があります。 モジュールの扱いに慣れていれば後者の「モジュールを使う方法」がとてもかんたんなのでまずはそれで Font Awesome を利用できる環境にしましょう。
$ drush dl fontawesome$ drush -y en fontawesome
Drupal コアの検索フォームに手を入れるには hook_form_search_form_alter()
を使います。
以下のように submit の部分をボタンに変更して CSS class を追加すれば OK です。
/*** @file* Drupal の検索フォームにスタイルをつける。*//*** Implements hook_form_alter().*/function njrc_search_form_search_form_alter(&$form, &$form_state, $form_id) {// スタイルをつけるため input submit を button に変更if (!empty($form['basic']['submit'])) {$form['basic']['submit']['#type'] = 'item';$form['basic']['submit']['#prefix'] = '<button type="submit" name="op" class="form-submit fa fa-search">';$form['basic']['submit']['#suffix'] = '</button>';}}
以上です。