Streaming live at 10am (PST)

Confused on Collection Lists


#1

Hey all,

I think I’m getting a little bit confused on the Webflow CMS and Collection List. I ran into the “Cannot have more than 20 Collection Lists on one page” issue, but I feel like I might be building my website incorrectly.

My collection contains just a few details on 40 people max: their name, talent (it’s for an Open Mic event), quote, and social media platforms they’re on. The data in the collection is all text, and ideally, I’d want to be able to list all 40 individuals’ information on one page across 40 different sections (view the website to see what I’m talking about), but I fear that my only solution is to create multiple pages with a separate collection list and a button linking to the next page.

My question is this: is there an easier way to go about getting all the information onto one page, with our without Collection / Collection Lists / Webflow CMS? Hand-typing is possible, but it’s not exactly easy and takes a lot of time.

My share link can be found here. Any and all help would be greatly appreciated. Thanks in advance!


#2

Hi @mattvaru

Collection lists and CMS can be tricky to wrap your head around at first, but once you get it…boom!

I think you can achieve what you are looking to do quite easily with just one collection with all their details, and one collection list on page. You would style each ‘collection item’ as 100vw/vh to achieve the ‘section’ approach rather than an actual section.

However, i’m just second guessing here, will these sections need to alternate left to right - so number 2 has the name and number on the right, number 3 back on the left again etc…? If so, may need to look deeper at some workarounds, as the styling for item 1 will be the same for all other items in the list.

If they are staying as is - you could still achieve some differentiation by giving each performer a background colour, and pulling that colour through as a background on the left side.

Hope that’s useful?


#3

Hey Stu,

I’ve gotta say… I didn’t even think about making the collection items 100vw/vh! That’s genius! I can’t even thank you enough.

Yeah, I think the alternating sections that I’ve built create a lot of confusion… I may try to simplify things, as I would love to be able to use collections to help automate the transfer of information.

I’m thinking out loud here, and need to run through this idea some more, but do you think it would be possible, somehow, to use two different collections and keep the alternating sections?

For example, the section that has both performers side-by-side would pull from one collection, while the next section (which has specific performer information) would pull from a different collection? Again, just spitballing. I figured I’d throw it out there while I’m working on implementing the fix you suggested.

Many, many thanks again.

Edit: I did what you said… and it works! I can’t even thank ya enough. Much appreciated!


Using the Editor to Delete Images
#4

Awesome - glad I could help!

It’s easy to forget that the ‘section’ and ‘container’ elements are actually just div blocks, the same as a ‘div block’ - they just have some handy Webflow set-styling to save time.

I’ve not looked into other solutions for the alternating styling, but here’s something off the top of my head…

Let’s say you want performer 02 to alternate/mirror from 01…

How about adding the two performers in one collection item?
So in the CMS, create one ‘Performers’ collection - here’s some fields:

Name: (L’s name and R’s name)
L (left) Performer name
L Talent
L Qoute
L Social Links
L Number
R (right) Performer name
R Talent
R Qoute
R Social Links
R Number

Repeat with a new item for 03 and 04, then 05 and 06…etc

In this case you would actually need to style the collection item on the page as 200vh, with performer L elements styled in the top half of the item and pulling through the L data, then style performer R in the bottom part pulling through the R data.

I think this should work, but it’s hot in the UK and my brain might be melting a little! As I say there could be other workarounds, this is just off the top of my head :exploding_head: :grin:


#5

Stu,

So sorry for my delayed response! I can’t even believe I missed this notification.

I actually think your idea will work — I’m going to test it out after this first run with the client, because I think it would be phenomenal if I could get the alternate styling going.

For now, I followed your advice and made the Collection Items 100vw/vh and removed the sections that contained the two side-by-side photos altogether. It makes things so much simpler, and since I’m on a time crunch, it will do just fine.

Thanks so much for all the help! :pray:


#6

No problem @mattvaru

Keep us posted how it all works out!