How to theme the views exposed form? I've created a view with a number of exposed filters, but it is pretty ugly looking.



I'd like to improve the theming, including wrapping the whole thing in a fieldset as well as grouping some of the other elements (like pairing the published and updated inputs), but not sure how to go about this.

I tried to var_dump the form, but it seems to go on forever and my browser locks up, so I can't easily learn anything about the form that way. 

I also tried putting the form as a fieldset child in another form, but getting all the form ID information and so on proved problematic (although, I did get the fieldset styling).

Anyone got any pointers?

Update:

I copied over the template from the module to my site's theme directory, and made a start.

&lt;fieldset&gt;
    &lt;legend&gt;Filters&lt;/legend&gt;

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


I can't seem to figure out how to pair up the date fields - I need to somehow modify the widget properties so I can wrap them in HTML (using hook_form_alter doesn't work because the #prefix and #suffix are added to $widget-&gt;widget so they break the output)
Theming Views' exposed form is hard because it doesn't behave like most forms and use its own label mechanism. So, you can't simply use a form_alter hook to add #prefix and #suffix to elements. But using THEME_preprocess_views_exposed_form, you can craft your own suffix/prefix mechanism:

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


and in the template file

&lt;fieldset&gt;
    &lt;legend&gt;Filters&lt;/legend&gt;

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