ビューの公開フォームにテーマを設定する方法は?


12

いくつかの公開フィルターを使用してビューを作成しましたが、見た目はかなり醜いです。

ここに画像の説明を入力してください

テーマを改善したいのですが、フィールドセット全体をラップしたり、他の要素をグループ化したり(公開された入力と更新された入力のペアリングなど)を含めますが、どうすればよいかわかりません。

私はフォームをvar_dumpしようとしましたが、それは永遠に続くようで、ブラウザがロックしてしまうので、そのようにフォームについて何も簡単に学ぶことができません。

また、フォームをフィールドセットの子として別のフォームに配置しようとしましたが、すべてのフォームID情報などを取得するのに問題がありました(ただし、フィールドセットのスタイルは取得しました)。

誰かがポインタを持っていますか?

更新:

テンプレートをモジュールからサイトのテーマディレクトリにコピーして、開始しました。

<fieldset>
    <legend>Filters</legend>

    <div class="views-exposed-form">
        <div class="views-exposed-widgets clear-block">
            <?php foreach($widgets as $id => $widget): ?>
                <div class="views-exposed-widget">
                    <?php if (!empty($widget->label)): ?>
                        <label for="<?php print $widget->id; ?>">
                            <?php print $widget->label; ?>
                        </label>
                    <?php endif; ?>
                    <?php if (!empty($widget->operator)): ?>
                        <div class="views-operator">
                            <?php print $widget->operator; ?>
                        </div>
                    <?php endif; ?>
                    <div class="views-widget">
                        <?php print $widget->widget; ?>
                    </div>
                </div>
            <?php endforeach; ?>
            <div class="views-exposed-widget">
                <?php print $button ?>
            </div>
        </div>
    </div>
</fieldset>

私は、日付フィールドをペアリングする方法を見つけ出すように見えることはできません-私は何とかウィジェットのプロパティを変更する必要があり、私はHTMLでそれらをラップすることができるように(hook_form_alterを使用して#prefixと#suffixが追加されているので、仕事をしない$widget->widget、彼らはそう出力を中断する)

回答:


22

ほとんどのフォームのように動作せず、独自のラベルメカニズムを使用するため、ビューの公開フォームのテーマ設定は困難です。したがって、要素form_alterを追加#prefix#suffixたり要素にフックを使用したりすることはできません。しかし、を使用するとTHEME_preprocess_views_exposed_form、独自のサフィックス/プレフィックスメカニズムを作成できます。

function THEME_preprocess_views_exposed_form(&$variables) {
  if ($variables['form']['#id'] == 'views-exposed-form-VIEWNAME-DISPLAYID') {
    foreach ($variables['widgets'] as $id => &$widget) {
      switch ($id) {
        case 'first_date_id':
          $widget->prefix = '<div class="date-widgets-wrapper">';
          break;
        case 'last_date_id':
          $widget->suffix = '</div>';
          break;
      }
    }
  }
}

そしてテンプレートファイル内

<fieldset>
    <legend>Filters</legend>

    <div class="views-exposed-form">
        <div class="views-exposed-widgets clear-block">
            <?php foreach($widgets as $id => $widget): ?>
                <?php if (!empty($widget->prefix)) print $widget->prefix; ?>
                <div class="views-exposed-widget">
                    <?php if (!empty($widget->label)): ?>
                        <label for="<?php print $widget->id; ?>">
                            <?php print $widget->label; ?>
                        </label>
                    <?php endif; ?>
                    <?php if (!empty($widget->operator)): ?>
                        <div class="views-operator">
                            <?php print $widget->operator; ?>
                        </div>
                    <?php endif; ?>
                    <div class="views-widget">
                        <?php print $widget->widget; ?>
                    </div>
                </div>
                <?php if (!empty($widget->suffix)) print $widget->suffix; ?>
            <?php endforeach; ?>
            <div class="views-exposed-widget">
                <?php print $button ?>
            </div>
        </div>
    </div>
</fieldset>

7

views-exposed-form.tpl.phpをsites / all / modules / views / themeからテーマパスにコピーして、テンプレートを上書きできます。


views-exposed-form--view_id.tpl.phpまたはviews-exposed-form--view_id--display_id.tpl.phpなどのパターンのみを使用して特定のビューを上書きすることもできます。詳細
user56reinstatemonica8

3

また、Better Exposed Filtersモジュールもご覧ください。折りたたみ可能なフィルターオプションを取得するには、-devリリースが必要ですが、適切な1.1リリースがすぐにリリースされることを期待しています...


3

form['#theme']アイテムの内容を調べる必要があります。これを行うためのより良い方法(より優れているvar_dump())を使用するdsm($form)か、さらにはkpr($form)、これらの関数はdevelモジュール(http://drupal.org/project/devel)をインストールした後に使用可能になります。form['#theme']約7要素の配列である必要があります。これらの要素は、このフォームがレンダリングされているときに呼び出されるテーマフックの名前です。それらを使用して、フォームにテーマを設定する独自の方法を実装できます。

アイテムの1つが呼び出されviews_exposed_form__VIEW_NAME__DISPLAY_IDます。

あなたのモジュール(もしあれば)にhook_theme()の実装があるはずです

function MYMODULE_theme($existing, $type, $theme, $path) {
  return array(
    'views_exposed_form__VIEW_NAME__DISPLAY_ID' => array(
      'function' => 'my_exposed_form_theme_function',
      'render element' => 'form',
    )
  );
}

// somwhere later in code

function my_exposed_form_theme_function($vaiables) {
  //$vaiables['form'] contains a form array
  //to display a form element call drupal_render($vaiables['form']['some element'])
  //don't forget to call drupal_render($form) 
  //after you are done with rendering individual elements
  //
  //you can use template_preprocess_views_exposed_form() from 
  // views/theme/theme.inc as an example

  return "concatenated results of multiple drupal_render() calls";
}

2

以前の状況では、Hook_form_alter()を使用して接頭辞と接尾辞をフォーム要素に追加し、divにまとめてスタイル設定できるようにしました。ただし、フィールドセットのラッピングについては不明です。

例えば。

$form['submitted']['full_name']['#prefix'] = '<div class="background">';        
$form['submitted']['message']['#suffix'] = '</div>';

1

Drupalのhook_form_FORM_ID_alterを使用してフォームを変更します。これは、価格フィールドの前に£文字を付けるという私の問題を解決したものです(これをカスタムモジュールに入れます)。

function THEME_form_views_exposed_form_alter(&$form, &$form_state, $form_id) {
   // check this is the right form
   if ($form['#theme'][0] == 'REPLACE_THIS') {
      // add the prefix
      $form['price']['min']['#prefix'] = "£";
   }
}


0

ビューの編集ページで、テーマ情報を確認できます(右下隅)。Drupalが画面のビューのさまざまな部分をレンダリングするために使用するテンプレートファイルに関する情報を提供します。デフォルトでは、viewsモジュール(themeフォルダー内)によって提供されるテンプレートファイルが使用されますが、ビューの表示方法を変更する場合は、それらのテンプレートファイルを、内部に配置できるカスタムテンプレートファイルで上書きできます。独自のカスタムテーマフォルダー(またはこのビューを表示するために使用されるテーマ)

このテーマ情報は、階層に従ってファイルに名前を付ける方法(または、ビューのテンプレートをオーバーライドする予定のテンプレートファイルの効果の範囲)を示しています。

現在、このテーマ情報には、ビューがこの特定のビューをレンダリングするために使用するすべてのテンプレートファイルが表示されない場合があります。

それで、sites / all / modules / views / themeに移動して、views-exposed-form.tpl.phpをコピーします(この場合、レンダリングフィルターのデフォルトを上書きするためです!)、それを独自のテーマフォルダーに貼り付けます。次に、同じ方法に従って、独自のテーマフォルダ内に配置したこのオーバーライドテンプレートファイルの効果を、それに応じて名前を変更して制御する必要があります。例:views-exposed-form--ビュー名-ペインname.tpl.php(ビューの編集ページのtheme:informationを見ると、命名法がわかります)

これで、このテンプレートファイルの個々のウィジェット(フィルターハンドラーによって生成された)にCSSを追加でき、それらの設定がフィルターに適用されます。

訪問http://eureka.ykyuen.info/2011/07/25/drupal-theme-the-exposed-filter-in-views/

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.