Skip to main content

CMS List Filters: Dynamic Filter

The Dynamic Filter automatically updates the items shown based on the current page's content. Place a CMS List inside a dynamic page, then set a reference property (single select) that points to a CMS model as the filter condition.

What is a Dynamic Filter?

A Dynamic Filter automatically narrows down the items displayed in a CMS List placed inside a dynamic page, based on the CMS item currently shown on the page.

Unlike a regular filter, the filter value automatically changes for each page. This makes it easy to build pages like category lists or related article lists.

Point: What is a CMS List?

A CMS List is a type of dynamic list that displays data from inside or outside Studio.Design on your site, specifically one that's connected to internal content data from Studio CMS.

You can also dynamically edit the list based on CMS properties you've set up in advance.


Requirements for setting up a Dynamic Filter

You can set up a Dynamic Filter when all of the following conditions are met:

  1. A CMS List is placed on a dynamic page.

  2. A reference property (single select) is used in the filter conditions.

  3. The combination of CMS Models linked to the dynamic page, the CMS List, and the reference property used in the filter condition matches one of the patterns described below.

Cases where Dynamic Filters can't be used

  • Dynamic Filters can't be set up on a CMS List placed on a regular (non-dynamic) page.

  • If a reference property is set up as multi-select, [Dynamic] won't appear as an option in the filter conditions.

  • Select and multi-select properties can't be used as conditions for a Dynamic Filter.

Model combination patterns for the dynamic page, CMS List, and reference property

A Dynamic Filter works by matching the CMS item shown on the current dynamic page against the reference property value on the CMS List side, and displaying only the items that match.

Because of this, the relationship between the models of the dynamic page, the CMS List, and the reference property must follow one of the patterns below.

The examples below explain which combinations let you use a Dynamic Filter, assuming you've created CMS Models called "Category" and "Article."

Pattern 1: The dynamic page and the reference property are linked to the same CMS Model.

  • CMS Model linked to the dynamic page: "Category"

  • CMS Model linked to the CMS List: "Article"

  • Filter condition property: "Category" within the Article model (a reference property / single select that references the "Category" model)

With this pattern, you can build "category-based article list pages" that automatically display the articles belonging to each category on its dynamic page.

Pattern 2: The dynamic page and the CMS List are linked to the same CMS Model.

  • Dynamic page model: "Article"

  • CMS List model: "Article"

  • Filter condition property: "Category" within the Article model (a reference property / single select that references the "Category" model)

With this pattern, you can show a "related articles list" inside an article page that's filtered to only show articles in the same category as the article currently being viewed.


Preparation before setting up a Dynamic Filter

Preparation 1: Design your property structure in the CMS dashboard

Before using a Dynamic Filter, design your property structure—including reference relationships—in the CMS dashboard.

  1. Create article items in an article-type CMS Model.

  2. Create CMS Models for classifying articles, such as categories or tags.

  3. In the article-type CMS Model, add a property (reference property) that references the CMS Model created in step 2, and set it as single select. If you add it as multi-select, the Dynamic option won't appear in the filter conditions.

    The reference property you set up here is what controls how list items change on the dynamic page.

    In the image below, as an example, a property that references a category-type model called [Category] is set on an article-type model called [Workshops].

Preparation 2: Create a dynamic page that displays items from the article model

Create a dynamic page that displays items from your article model.


How to set up a Dynamic Filter

Note: About contacting our support team

  • Based on the Studio.Design Support Policy, our support team isn't able to provide individual walk-throughs of setup procedures or advice on how to combine filter conditions.

  • If you think you've found a bug, please contact chat support from the [?] icon at the bottom right after signing in to Studio.Design.

Step 1. Add a CMS List to a dynamic page

  1. Open the Design Editor.

  2. Either add a new dynamic page where you want to display the article list or category-specific list, or open an existing dynamic page.

  3. From the navigation on the left side of the screen, select the [Connect] icon

    to open the Connect panel.

  4. Select the CMS List linked to the CMS Model you want to display, and place it on the dynamic page.

  5. Adjust the appearance, layout, and other display design settings.

    If needed, see the article collection for Box design settings.

Step 2. Set up a Dynamic Filter on the CMS List

  1. Select the CMS List placed on the page. Be sure to select the entire CMS List, not just an individual list item.

  2. In the right panel, select the [Data] tab. If the panel is closed, open the right panel first.

  3. Under [Filter], set up your filter as follows:

    1. Click [+] next to [Filter] to add a filter.

    2. In the [Filter] input field, select the reference property you set up in Preparation 1 for classifying articles from the dropdown list.

      In the example image below, the reference property for the category model [Category] is selected.

    3. In the [Filter condition] input field, choose a condition labeled [Dynamic].

      • If [URL query is set] is shown, click the [Set value individually] link button to the right to choose a condition.

      • If [Dynamic] doesn't appear in the dropdown list, check the "Requirements for setting up a Dynamic Filter" section on this page, and review your CMS Models and reference properties to make sure they meet the requirements.

Step 3. Check the behavior in preview and on your published site

  1. Check that the filter conditions are working as expected in the editor or in Live Preview.

  2. Update your site from the Publish panel. Your changes won't be reflected on the published site until you do this.


Things to keep in mind when setting up filters

  • You can add up to 5 filters.

  • When you set up multiple filter conditions, they're all applied as AND conditions. OR-based filtering isn't supported.

  • You can combine a Dynamic Filter with other filters (fixed filters or URL query filters), but depending on how they're combined, the result may end up showing zero items.

Did this answer your question?