Made in Webflow

CMS Dictionary, Grouped with Leading First Character Title

site profile thumbnail


An attempt to create a dictionary based on a single collection with 'first character' titles. Here I wanted to avoid using a nested second collection with multi-refs for the 'first characters' because it became too messy for the client to manage because they'd have to (1) add the term+definition but then also (2) add as a multi-ref item within the 'first character' collection. Just too much work for the client. So instead, this single collection uses a toggle to define the groupings based on the first character with a 'first-character' combo class, conditional logic, and sorting to achieve the groupings. Additionally, using finsweet js to combine collections to remove Webflow's limitation per page. UPDATE: Checkout Timothy Ricks' solution which is super clean and pure genius:
Feeling inspired?If this Made In Webflow site sparked some inspo, why not get started on a project of your own? Clone a site, purchase a template or start building from scratch.

We miss comments too!

Right now, Made in Webflow doesn't offer all of the same functionality that Showcase did, like the ability to leave comments. But don't worry: We're working to bring comments back as soon as possible!

As always, we'd love to hear your feedback! Click the link below to take a short survey about Made in Webflow.


More by Jason Roach

See profile
View details
Responsive Spiral/Looping Timeline with Staggered/Offset Grid of Pill-Shaped Cards