Setting Up Filters for Lists

Setting Up Filters for Lists

No matter what type of app you are building with Grandstand you will need to build a list at some point. For many of our events, lists are used to show Food Vendors or Trade Show Vendors. For other apps it might be used to show Sponsors, Staff, or Groups of Members.

No matter what type of list you are building, you can improve the usability of your lists by adding Filters to the top of your list page. Filters are a way to give your users easy sortability for your lists of any size. And because Grandstand strives to eliminate app user clicks, these filters are setup as horizontal scroller at the top of your page without clicking on a separate filter button to get started.

Depending on your settings, filters can work multiple ways each producing different results. Here is a quick rundown of those options followed by how to setup a sample list with filters:

1. Hide Bar (Default Setting): With this option there will be no horizontal bar shown at the top of your list page in your app. Any tags you add to individual list items will not be used or shown. All list items you add to your list group will be shown without any filtering options.
2. Show Bar (General Match in Title & Description): This is the hybrid option that allows you to add custom filters to your list page without setting up tags for each list item. When this option is selected and you have added at least one item to the 'Filters to Include' area, each list item will be searched to find the matching word (or phrase) in either the title or description. For example, let's say you set your 'Filters to Include' as "Beer, Soda, Coffee". When an app user selects "Soda" your list of food vendors will be cut down to only show vendors where the word "Soda" appears in the title or in the description. This means "Soda Stan's" would show up, as would "The Lucky Bar" that lists Soda in their description. 
3. Show Bar (Show Bar (Must Match Tags): If you have tags set on many of your list items this solution will give you fine-grained control over what shows up when each filter button is clicked. For example, let's say you set your 'Filters to Include' to "Beer, Soda, Coffee". When an app user selects "Soda" your list of food vendors will be cut down to only show vendors that were tagged as "Soda". This means that even "Soda Stan's" has to have been tagged as "Soda" or it will not show in the list.

The first step in setting up Filters is to select the correct Filter Bar option for each List Group. No matter which one you choose, you must also enter your comma-separated list of "Filters to Include" or nothing will show up in the app on your Filter Bar. Here is an example of how one event set up food types that might appear on menus:

In the case above the List Group is set to be a general match which means that it does not matter what tags (if any) are associated with each list item. In this easy method, the filter row is just looking for a match in the title or description (ie: a description that has the word "Brats" in it.

In the next example above, the List Group is set to match tags. This means only list items that have the tag "Print", "Digital", or "Radio" will be shown when filtered. As a reminder, tags are setup separately for each list item and each list item can include multiple tags. For example, "Rudy's BBQ" could include the tags of "BBQ,Brisket,Ribs,Beer,Soda" and plenty more.

Other Notes

• Filters can be used with or without List Subcategories. Once a filter is selected the list subcategory dividers will disappear but will reappear again once All is selected again.
• The first filter, which is labeled "ALL", will always be included with your filters to allow the user to get back to the full list. You do not need to add this to your list of filters as it will automatically be added.
• The Your list of filters does not affect what gets displayed when "ALL" is selected. All is solely determined by what List Items you have assigned to your List Group.
• The Capitalization does not matter when setting up your Filters to Include list.
• The Tags can be setup as part of your batch upload of list items if interested. This makes adding them to your overall project much easier.
• The If using a Filter Bar where you Match Tags please remember that exact spelling matters. Let's say you use "Hats" in your Filters to Include. If you then have a list item with the tag "Hats & Gloves" it will not be shown when the user selects "Hats". This even includes plurals of words, meaning "Hats" will not match with "Hat".
• The You can order your Filters in the "Filters to Include" area in any way you would like. This is one of the advantages of our system is that you have full autonomy for how these filters show up.
• The Your map filters, and coupon filters share the same general font and color scheme across the app. In fact the style for these filters is changed on the Fonts & Colors -> Maps page in Grandstand Admin.

Wrapping Up

No matter which method you choose, adding Filters to your Lists will improve the usability of your app.

Lists