Customizing Appearance
There are many built-in features which will allow you to customize the structure and appearance of your search forms.
Custom Form Field HTML
You can insert custom HTML markup in your form fields by using the pre_html and post_html parameters. These parameters insert HTML directly before and after a form field, respectively.
Example:
$args['fields'][] = array('type' => 'search', 'placeholder' => 'Enter search terms...', 'pre_html' => '<div class="row">', 'post_html' => '</div>'); |
In this example, the generated search field would be wrapped in a custom div element with class “row”.
Custom CSS Classes
You can specify custom CSS classes for any form field, as well as for the search for itself by using the
class parameter:
$args['fields'][] = array('type' => 'search', 'placeholder' => 'Enter search terms...', 'class' => array('myclass', 'anotherclass')); |
Custom HTML Blocks
You can also insert blocks of custom HTML markup inside your search form by using the html field type.
Disable HTML Wrappers
By default, form fields are wrapped in outer div elements. You may wish to remove these in order to more easily customize the appearance of your search form. You can do this by setting ‘disable_wrappers’ => true in your form configuration:
$args['form'] = array('disable_wrappers' => true); |