How can I link each of my CMS collections, "stays_austria" and "paris", to the items on the travel selection section on my Webflow homepage?
- Add separate Collection Lists to the homepage’s Travel Selection section for “stays_austria” and “paris,” binding elements to display CMS content.
- Link each item to its CMS template page using "Current Collection Item," and optionally filter or tag content to display specific locations.
To link your two CMS Collections, "stays_austria" and "paris", to the Travel Selection section on your homepage, you'll need to use Collection Lists and Filter Logic based on CMS content. Here’s how to do it.
1. Add Collection Lists to the Homepage
- Go to your homepage in the Webflow Designer.
- Drag a Collection List from the Add Panel into your Travel Selection section.
- In the Collection List Settings, connect it to your first CMS collection (stays_austria).
- Repeat this process to create a second Collection List for paris.
2. Design Each Collection List Item
- Within each Collection List, drag elements (e.g., Image, Heading, Button) to display CMS fields like name, image, or description.
- Bind each element to its respective CMS field by clicking on it and choosing Get Text from or Get Image from.
3. Link Each Item to Its CMS Page
- Select the link (button or text) inside the Collection Item.
- In the Settings panel, set the Link Type to Current Collection Item.
- Webflow will link to the collection template page for that item (e.g., stays_austria or paris details).
4. Add Filters or Headings to Separate Content
Add headings like “Austria Stays” and “Paris Stays” above each Collection List to visually separate them.
Use Filters under Collection List Settings to display only specific tagged items (if you have everything inside a single CMS).
Example: If you're using one unified collection, create a reference field called location, and filter based on whether the value is "Austria" or "Paris".
5. Style and Organize Responsively
- Make sure both sections are styled consistently to match your homepage.
- Use Flexbox or Grid for layouts as needed.
Summary
Create Collection Lists on the homepage for each CMS (or filter one CMS by location), bind them to content, and link each item to its CMS template page using Current Collection Item. This gives users dynamic access to "Austria" and "Paris" travel stays through your homepage's Travel Selection section.