Collection list categories/headings?

I want to create a list of Press Releases divided into categories (Years) as headings for each year.

For instance I want to show a Heading “2023” followed by a list of press releases (text-links) from that year, and then I want to show the next year below: 2022 with its corresponding list of text links. I want this to be dynamic and that a new year is created automatically when the client creates a new press release from the new year.

I’ve tried creating multiple collection lists with filters, but this means I have to create them manually each year. I’ve also tried multi-referencing and nested collection with Finsweets solution but that would mean the client needs to create a list of Years and then selecting which press releases correspond to that year, a bit tedious. I’d rather have it the client creates a press releases and selects which year it belongs to. Not the other way around.

Any ideas would be helpful!

Here is my public share link: Webflow - NextCell Pharma

1 Like

Custom code is your best choice here if you’re comfortable with a little bit of javascript- a little bit of code can save you a lot of CMS admin.

This approach can work too, though it’s a bit redundant. You can create up to 20 years if you have the collection lists available, and you can create future years that don’t exist yet.

Ideally though, the client won’t have to select anything at all. With custom code the date you already have is all you need to create your groupings.

Sounds great, thank you @memetican. Do you have any ideas to the code? I have no problem in implementing the code, but don’t have knowledge in how to write it myself.

Yes if you need help with the coding, PM me and I can send you rates.

The basic approach is to;

  • Emit your date as an accessible field in your CMS items, probably in a CMS-bound custom attribute
  • Generate your list and sort by date
  • Iterate through the list, looking for date changes
  • Insert your header HTML elements at that point, with the year of the date

Note this approach would only display years that have content, and would skip years that didn’t.