Mapbox: Displaying >100 CMS collection items on a map

Design help CMS
1

Hello! I added a map to my website which should show a collection of hotels all over the world.

My collection currently lists around 300 hotels (and growing!) but Webflow is limited to 100 items.

I’ve seen on older forums that it is possible to combine lists to show more than 100 items. Is this also possible with a map?

Here is the read-only link: Webflow - Outbound Stays

Here is the live page: About - Fabrik Webflow Ecommerce website template

1 Like
2

Hi Christopher,

It will depend on the details of your mapping solution, how it tags items as display cards, etc, but in general this approach should work;

  1. Prep. Make your collection list item contents a component, create the properties, and bind it those properties to your collection list.
  2. Duplicate. Now clone the entire collection list 2 or 3 times ( once per 100 items )
  3. Range. For each of those, set the range settings. Collection list #1 starts at 1. #2 starts at 101, #3 starts at 201…

This will give you all 300 to 400 cards in the page, for your JS for the map integration script to access.

Important- if you ever filter or sort your collection lists, make sure to use the same filtering and sorting settings an all of them to avoid duplicates or gaps in your output.

image
image1920×919 247 KB

3

Thank you so much! It worked

1 Like