Organize Page by Category with CMS

I’ve been looking around and can’t find a great answer for a seemingly simple page design. I am trying to build a page broken out by categories of items. Take a team page for example. I want to show all the team members on one page, but have them sorted into their respective teams with a title of that team in each section on that page. Is there a way to build this so an editor can add/remove/reorder page structure in the CMS?

Various constructions here…

The simplest way is;

  • Person collection contains people
  • Teams collection contains teams, with a multi-ref to Person ( let’s call that field Members )

On a static page-

  • Collection list bound to Teams
  • Nested collection page bound to Members **

** Currently that nested list will be limited to 5 Members max, but Webflow’s making some changes there very soon.

On the Team collection template page-

  • Collection list bound to Members- has no count restrictions here because it’s not a nested list

On the Person collection template page-

  • Collection list bound to Teams
    • Filtered to “where Members contains Current Person”

Lets you show a list of the teams a given member is in.

1 Like

Thank you. I appreciate your reply. :smiley: I came to this solution as well, but I thought it might be strange for the editor to assign a Team Member to a Team from the Team Categories collection vs. assigning them to the category from the Team Members collection. I suppose that solves it, but I wondered if there was a different way to view this that I hadn’t thought about.

Excited to hear there are changes coming for the nested item limitation. Thanks for that info too.

I had the same challenge learning Webflow, because I come from a SQL db background. There it’s common to manage a relation from either end.

In a NoSQL setup like Webflow’s MongoDB infrastructure the referencing is one-way so you need to choose an approach.

You could do Person-ref-Team, or Person-multiref-Team, but it changes the way pages ae assembled and doesn’t really make things easier per-se.

I do use Person-ref-Team when it’s a 1:N relationship, as you said it’s easier to admin and avoids the possibility of accidentally double-classifying something - like putting Chicago in Illinois and Wisconsin at the same time.

But the grouping becomes more difficult. because there isn’t a mechanic to do nested lists that way in Webflow, where the nested list links to People and is filtered by the parent list’s Category.

When I want to do that, I use the SA5 Layout lib-

There you’d emit the groups in one collection list, and the People in a second collection list, and then tag them with custom attributes. SA5 stitches them together using an item-to-container approach.

1 Like

This is exactly what I struggled with. Thank you for precisely validating my issue and for providing me with this resource.

1 Like