Configuring the Search Bar widget

The Search Bar widget lets visitors search and filter the entries in a View. You choose the fields it offers and how they are laid out, and you set whether a search must match every field or any of them.

Adding a Search Bar widget #

In the View editor, click Add Widget in one of the widget areas, such as Top Widgets, then choose Search Bar.

To configure it, click the gear icon next to the Search Bar label. This opens Search Bar Settings. A new Search Bar has no fields until you add them.

Adding fields and designing the layout #

In Search Bar Settings, search fields are placed in rows, and each row has one to four columns.

• Click Add Row to add a row.
• In a column, click Add Search Field and choose a field.

Drag rows and fields to move them. Hovering over a row also shows its toolbar: the gear opens Row Settings, where you can give the row a custom CSS class or HTML ID, and the trash icon deletes the row.

Column settings

Hovering over a column shows a Clear all fields link, which removes the fields from that column, and a gear icon that opens Column Settings.

In Column Settings, Arrange Fields sets how the column’s fields are laid out on the page. Stacked (vertical), the default, puts each field on its own line. Side by side (horizontal) puts the fields next to each other, and they wrap onto a new line when the column runs out of room.

Search field settings

To change how a field works in the Search Bar, click the gear icon on the field.

The options depend on the field type. A Drop Down field such as Department has Show Label, Custom Label, Input type, Pre-Filter Choices, Default Value, Make visible only to logged-in users?, and Custom CSS Class. Pre-Filter Choices affects security, so read Only show choices in the Search Bar that exist in entries before you turn it on.

Setting a default value

A search field can start with a value already chosen, so the View opens filtered and visitors see that value in the Search Bar.

To set one, click the gear next to the field in Search Bar Settings, then fill in Default Value. A field with choices, such as a drop down or radio buttons, offers its choices in a list that starts with No default. A text field and Search Everything offer a text box. Submit Button, Search Mode, and Entry Date have no default value.

When the View opens without a search, it lists only the entries that match the defaults. In the example below, Color shows Green and only the Green entries are listed. If you set defaults on more than one field, the Search Mode setting decides whether entries must match all of them or any of them. With Hide View data until search is performed turned on, the View stays empty until the visitor searches, even when fields have defaults.

With Show Clear button turned on in the Submit Button settings, which it is by default, the Clear button shows from that first visit. A visitor can pick another value and search, empty a field and search to drop that filter, or click Clear to empty the Search Bar.

A field set to Make visible only to logged-in users? applies its default only for logged-in visitors. Pre-filtering results on a View covers the other ways to limit which entries a View shows.

Supported search fields

File Upload, Post Image, Post ID, and Section fields can’t be searched, so the Add Search Field list leaves them out. The list also has these entry details:

• Entry Date: when the entry was submitted.
• Entry ID: the entry’s number.
• Entry Creator: the WordPress user who submitted the entry while logged in.
• Is Starred and Is Read: whether the entry is starred or marked as read in Gravity Forms.
• Approval Status: whether the entry is approved, disapproved, or unapproved. Learn more about entry approval.

Special search fields

Some fields in the list don’t come from your form:

• Search Everything: one text box that searches all of an entry’s fields.
• Submit Button: the button that runs the search. Its settings include Show Clear button.
• Search Mode: sets whether a search must match all fields or any of them. See Search mode below.
• Geolocation Radius: filters entries by their distance from a location. It comes with the GravityView Maps Layout. Learn more about radius search. To show each entry’s distance from the searched location or list the nearest entries first, see Showing distance and sorting by distance in radius search results.

Field-specific behavior #

The Input type setting lists the inputs a field can use, and they depend on the field type. A text field uses a text box. A Number field can also use a number range, and a Date field a date picker or a date range. Fields with choices can use Select, Radio, or Links, and Checkboxes and Multi Select fields can also use Checkbox or Select (multiple values). Modifying Search Bar inputs lists them all and shows how to add your own.

A text box lists entries whose value contains the text, in any letter case, so lab finds Piano Lab. Select, Radio, and Links match the whole choice. To make a text search match a whole value, see How to search for an exact match.

Letting visitors clear a radio button field

Once visitors select a radio button in the Search Bar, they can’t deselect it. To let them clear the field, add a choice that has no value.

1. Click the gear next to the field in Search Bar Settings, and set Input type to Radio. A radio button field from your form starts out as Select in the Search Bar, and the option in the next step appears only for Radio.
2. Check Add a "no value" option.
3. To change the choice’s text, fill in No Value Label. Left empty, the choice reads All.

The new choice comes first in the list. It’s selected whenever the field has no search value, such as on a first visit when the field has no default. When a visitor picks it and searches, the search stops filtering on that field, and entries with nothing in that field can show too.

Search mode #

When a search has values in more than one field, the search mode decides which entries are listed. A new Search Bar has no Search Mode field, and its searches match any field.

• Match Any Fields: an entry is listed when at least one of the searched fields matches.
• Match All Fields: an entry is listed only when every searched field matches. A field left empty is skipped, so a search for Piano in Department with an empty Course box lists every Piano course.

To set the mode, add the Search Mode field and click its gear. Its Search Mode setting starts at Match All Fields. With Input type left at Hidden Field, the mode applies to every search and visitors don’t see it. With Radio, visitors choose Match Any Fields or Match All Fields in the Search Bar.

Matching multiple values within a single field

When a visitor picks more than one value in a Checkboxes or Multi Select field, the field matches entries that have any of those values. Match All Fields works between fields, so it still requires a match in each of the other searched fields.

For example, picking Online and Evening in a Format field lists the courses that are online or in the evening. Adding Theory in Department with Match All Fields keeps only the Theory courses among them.

Advanced search #

Fields under Advanced Search fields shown in Search Bar Settings stay hidden on the page until a visitor clicks the Advanced Search link. Use it for filters most visitors don’t need.

Once the visitor opens it, those fields work like the rest of the Search Bar. When a search uses one of them, the page loads with the section already open.