How do I nest Collection lists in Webflow?

Link the parent Collection first

A nested Collection list shows items from a related Collection inside each row of a parent list. Webflow's nesting article starts with a multi-reference field, not with the second list. The parent Collection holds that field. The field points at one child Collection.

Example: Offices is the parent. Services is the child. Each office item stores the services you select, such as Repairs and Installations.

Open Collection settings for Offices. Click Add new field and choose Multi-reference. Name the field Services. In the Collection dropdown, choose Services. Save the field, then save the Collection. Open each office item and select the services that belong to it. An office with no services selected has an empty relationship until you choose some.

The multi-reference guide is the field itself, including the list you connect to that field on a Collection template. Use that pattern when you are on one office page and only want that office's services. Use nesting when a single page lists many offices and each office shows its own services inside the card.

Put the child list inside the parent item

Add a Collection list to the page and set its source to Offices. Add the elements that should show on every office, such as the office name, and bind them to Office fields.

In the Navigator, select the parent list's Collection item. Add a new Collection list there, so the new list is inside the item, not beside the parent list. Webflow's nesting article then says to select the nested list, open Element settings, Collection list settings, and choose the child Collection in the Source dropdown. Add a text element inside the nested list and bind it to the service name.

Check that source before you style it. Webflow's multi-reference article says to connect a Collection list to the multi-reference field, not to the referenced Collection. A list connected to the Collection pulls every item. A list connected to the field pulls only the items you selected, in the order you set on the parent item. If the downtown card lists every service, change the nested list's source to the Services field.

Webflow's article says you cannot nest Collection lists inside a component. If the office card is a component, build the nested lists on the page first, or keep the card as ordinary elements. Putting the inner list on the main component is the step the product blocks.

Style the inner list after the source is correct. A row of text labels is enough for services. Filters, sort, and item limits on a normal list are covered in their own guides. Get one office showing the services you selected before you add rules.

Stay inside the nesting limits

Webflow limits how many dynamic lists a page may render. From the nesting article, you can nest up to three levels, create up to 10 nested Collection lists on a page, and display up to 100 nested items per parent item. The dynamic limits article states the same caps and adds that a page can have up to 40 Collection lists in total, including nested ones. Each Collection list displays up to 100 items by default, nested lists included.

Three levels is a parent, a child, and a grandchild. Webflow's example is a course that contains lessons, and lessons that contain assignments. The middle list needs its own multi-reference field pointing at the grandchild Collection. Offices and services are two levels. Add a third only when the service itself must list another Collection, such as the staff who deliver that service.

If you are at a limit, Webflow will not add another Collection list and shows an error. Remove a list you do not need, or split the page, before you keep stacking. These caps are about what one page displays. They are not the cap on how many items the CMS can store. Storage follows the Site plan or Platform plan.

To show fewer than 100 items, or to pass 100 with pagination or skip, use the limit guide. A nested list counts toward the 40 lists on the page, so duplicating lists to skip ahead also spends that budget.

Publish one office and read the card

Publish the Offices items you edited, and publish the page. Open the live page and read two cards. The downtown office that you linked to Repairs and Installations should show those names. An office you linked only to Repairs should not show Installations.

If every office shows every service, the nested list is connected to the Services Collection. Connect it to the Services multi-reference field instead. If one card is blank, that item has no child items selected, or the item is still a draft. If the inner list is missing after you edited a component, move the list out of the component.

Collection list limits apply on static pages and on Collection pages. A busy template can hit the 10 nested lists or the 40 lists even when the design looks simple, because each nested list counts.

Ask for the list when the relationship is the work

Writing the offices, ticking the services, and checking two live cards is content work on a site you already have. The membership is one plan for every existing Webflow site: $999 per month, including 10 hours of Webflow work. Additional work is $75 per hour and starts only after you approve a written estimate. Your Webflow subscription and hosting stay in your own account.