Как оформить тему представленных форм?


12

Я создал вид с несколькими открытыми фильтрами, но он выглядит ужасно.

введите описание изображения здесь

Я хотел бы улучшить тематику, в том числе обернуть все это в набор полей, а также сгруппировать некоторые другие элементы (например, объединить опубликованные и обновленные входные данные), но не уверен, как это сделать.

Я пытался изменить форму var_dump, но, кажется, она продолжается вечно, и мой браузер блокируется, поэтому я не могу легко узнать что-либо о форме таким образом.

Я также попытался поместить форму как дочерний набор полей в другую форму, но получение всей информации об идентификаторе формы и т. Д. Оказалось проблематичным (хотя я получил стилизацию набора полей).

У кого-нибудь есть указатели?

Обновить:

Я скопировал шаблон из модуля в каталог тем моего сайта и начал.

<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

Открытая форма Theming Views сложна, потому что она не ведет себя как большинство форм и использует собственный механизм меток. Таким образом, вы не можете просто использовать 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 -cted-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 элементов. Эти элементы являются именами хуков тем, которые вызываются при визуализации этой формы. Вы можете использовать их, чтобы реализовать свой собственный способ оформления формы.

Один из предметов будет называться 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, который затем можно стилизовать. Не уверен насчет оборачивания в fieldsets все же.

например.

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

1

Используйте hook_form_FORM_ID_alter в Drupal, чтобы изменить форму. Вот что решило мою проблему с префиксом символа £ в моем ценовом поле (поместите это в свой пользовательский модуль):

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 для отображения различных частей представления на экране. По умолчанию используются файлы шаблонов, предоставляемые модулем представлений (внутри его папки тем), но в случае, когда мы хотим изменить способ отображения представления, мы можем переопределить эти файлы шаблонов с помощью пользовательских файлов шаблонов, которые мы можем поместить в наш собственная настраиваемая папка темы (или тема, которая будет использоваться для отображения этого представления)

Эта информация о теме показывает нам, как дать имя файлу в соответствии с иерархией (или область действия файла шаблона, которую вы собираетесь переопределить в собственных шаблонах представлений).

Теперь эта информация о теме может отображать не все файлы шаблонов, которые представление использует для визуализации этого конкретного представления.

Итак, перейдите на сайты / all / modules / views / theme и скопируйте views -cted-form.tpl.php (потому что в этом случае мы хотим переопределить значение по умолчанию для фильтров рендеринга!) и вставьте его в свою собственную папку темы, теперь вы должны следовать тому же методу, чтобы управлять эффектом этого перезаписываемого файла шаблона, который вы поместили в свою папку темы, переименовав его соответствующим образом. например, views -cted-form - ваша панель имен name.tpl.php (вы поймете номенклатуру, посмотрев на theme: информацию на странице редактирования представления)

Теперь вы можете добавить CSS к отдельным виджетам (сгенерированным обработчиками фильтров) в этом файле шаблона, и эти настройки будут применены к фильтрам.

посетите http://eureka.ykyuen.info/2011/07/25/drupal-theme-the-exposed-filter-in-views/

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.