Nested collection lists for a categories page

Hi,

I need help designing a dynamic collection list of subcategories for my category CMS page. I currently have 3 collections that I’ll be referencing: Library Posts, Categories, and Subcategories. These are individually working great. But I’m having trouble setting up my Categories page. Ultimately I’d like to have a list of the Category’s relevant Subcategory titles (e.g. Meals = breakfast, lunch, etc.), each with a few relevant Library Posts included below the Subcategory title (e.g. 10 best breakfasts, how to make great scrambled eggs, etc.). Please see attached image for my use case.

As you can see, I’ve set up a collection list that references Subcategories. Within each of those items I’ve set up an H2 component with a property that ties to the Subcategory title, and another collection list for the library posts within that category. Based on my understanding, I should be able to tie that nested library posts collection list to the Library Posts collection and filter based on the current Subcategory. Is this not the case? Why is it only give me the option to reference parent categories? Do I have it set up incorrectly? Hoping I’m close!


Here is my public share link: Webflow - Pacify.com

It would be nice, wouldn’t it.

Nested collection list are very limited.
For one, they can only bind to fields on the parent collection such as multi-ref fields and image gallery fields.

You basically have two options for your setup;

1- Add a multi-ref to subcategories, and identify a few library posts you want to display here.
It’s duplicate data, but you’ll be able to bind to that,

2- Emit your library posts in an entirely separate collection list that is not nested. Then use custom JS to do the nesting after the page loads.

Personally, I hate duplicate data so I use technique #2 a lot. It keeps the admin clean but pushes the burden to the page render to fix these limitations.