Dynamic Pages: Dynamic Filters

In this document, we'll go through the steps needed to set up dynamic filtering. Dynamic filtering is considered an advanced option within dynamic pages. If you are not yet familiar with dynamic pages, please see our other dynamic pages docs to learn how to use them.

To use the dynamic filtering function on a dynamic page, you will need to create two collections. One collection for your data and one collection for your categories. In this document, we will set up an example that sorts vacation rental listings. Specifically, we will create a filter that allows users to view homes based on whether they are pet friendly or not.

Set Up Dynamic Filtering

Start by creating a data spreadsheet. We will refer to this as our Property Listings spreadsheet. We'll do this in a google spreadsheet; but this can also be done using an Airtable or an internal collection.

Create a collection and link it to our Property Listings spreadsheet. We will refer to this collection as the Properties Listings collection.

With the Property Listings collection created, now create the second collection, this will be an internal collection. For this collection, create fields for the same categories that are in your Properties Listings collection (i.e. category name, image, etc).

With both collections created, now create two dynamic pages, one dynamic page for the Properties Listings collection, and one dynamic page for the Property Data collection.

Create the dynamic page for the Property Category collection. This dynamic page is where the dynamic filtering will be applied to your widgets that are linked to connected content.

Create a dynamic page for the Property Data collection. This dynamic page is where the data from the Property Listings collection will be displayed when the connected content on the Property Listings dynamic page is clicked.

Open the Property Listings dynamic page and add a photo gallery widget (a list widget can also be used for this as well). Next, connect that photo gallery to your Property Listings collection.

Open the Property Data dynamic page, add a photo gallery there as well (or list widget) and connect that widget to the data collection.

Go back to the Property Listings dynamic page, open the photo galleries connection (right click > connected data > change connection), and from the top of the new window click the Filter & Sort tab.

From there, locate the Dynamic Filters section and click the +Add Filter button.

Now you can map 2 fields from 2 different collections (Dynamic page & Widget) to dynamically present the widget content. In this example we will set the Pet Friendly field from the Property Listings collection to filter based on the Pet Friendly field of the Property Data collection. This will allow the widget to dynamically filter the content so that only the properties that are marked No within the spreadsheet for the pet friendly field will display together, and only the properties marked Yes within the spreadsheet for the pet friendly field will be displayed together on the dynamic page.

Open the non-dynamic page where you wish to link to the dynamic pages from and add a photo gallery (or list widget). For this example, we'll just use the home page.

Add the photo gallery widget and connect it to the Property Listings dynamic page.

Lastly, create a filter for this photo gallery using the Filter & Sort tab, and then create a Fixed Filter using the +Add Filter button. Set this filter to use both the category Pet Friendly and the term Yes and click done. You now have a photo gallery that will only show the real estate properties that are marked as Yes for the pet friendly field, and that has a dynamic filter setup on the dynamic page to only pull in and display those specific properties that are pet friendly.

To only show the properties that are not pet friendly, you can add another photo gallery, setup a fixed filter, and then set the term to No instead of Yes.