# Search and filters

Chapter 14 of the Hooray user guide.

## Collection and search pages

The **Collection** section shows the title, the description and, with **Show collection image**, the collection's image, then your products in a grid with page numbers. From 990px wide the filters are a sidebar. Under that they're a drawer, opened by the **Filter** button. **Sort by** sits above the grid, and active filters show as removable pills. Filtering updates the results without reloading the page.

Chapter 4 lists the **Collection** and **Search** settings. As shoppers type in the search drawer, it shows matching products, collections, pages and articles.

## Filters need the Search & Discovery app

Filters come from Shopify's free **Search & Discovery** app. Hooray shows whatever filters the app provides, on every collection and on search results. **Without it, or with no filters added, there are no filters**, and three of Hooray's links lose their filter:

* **Occasion tiles** without their own link or collection open the whole base collection instead of that occasion (chapter 8).
* **Occasion chips** on the product page open the whole collection.
* **Turning picker ages** open the whole number balloon collection instead of that number.

In every case Shopify quietly ignores the filter in the address, so nothing breaks; shoppers simply see more than they asked for. Add the two filters below and all three work.

To add the **Occasion** and **Number** filters:

1. Create the `custom.occasions` and `custom.number` definitions and fill them in on your products (chapter 7).
2. In admin, go to **Apps** and open **Search & Discovery**. If you haven't got it, install it from the Shopify App Store.
3. Click **Filters**, then **Add filter**.
4. Click the **Source** field and choose your **Occasions** product metafield. Change the **Filter label** to "Occasion" if you like, then click **Save**.
5. Click **Add filter** again, choose your **Number** product metafield as the **Source**, label it "Number" or "Age", and **Save**.

Check **Enable filtering** is on in the **Collection** section, which it is by default. If a value doesn't appear after you've changed your products, allow some time for Shopify to index it; a small edit and save on the product can hurry it along.

The links use the metafields' keys, not the filter labels, so you can label the filters however you like: `?filter.p.m.custom.occasions=Birthday` and `?filter.p.m.custom.number=30`. If your metafields have other keys, change **Occasion metafield** and **Number metafield** in the sections to match (chapter 8).

Shopify's limits:

* A store can have up to 25 filters.
* A filter shows up to 100 values on your store.
* Collections with more than 5,000 products don't display filters.
* A metafield filter works on these types: **Single line text**, **Single line text (List)**, **Decimal**, **Integer**, **True or false**, and **Metaobject reference** (one or a list). So `custom.occasions` and `custom.number` both work as filters. A list of integers doesn't, which is one reason `custom.number` holds a single number.

If your products spell an occasion two ways ("Baby shower" and "Babyshower"), fix the spelling: the tiles and chips link to one exact value.

Other good filters for a party shop: **Availability**, **Price**, **Product type**, and your options such as **Color** and **Length**. The same app sets the **complementary products** for Product recommendations (chapter 4).

## Links to an occasion or an age

With the filters on, you can link straight to an occasion or an age from a menu, a button or a promo. Add the filter to a collection's address:

* `/collections/all?filter.p.m.custom.occasions=Baby%20shower` (use `%20` for a space)
* `/collections/number-balloons?filter.p.m.custom.number=21`

To give an occasion its own page and description, make a collection for it instead, and choose it in the occasion tile.
