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?
TL;DR
- Use Link Blocks or Buttons on the homepage to direct users to either filtered CMS Collection Lists (based on a "Location" category field) or individual Collection Pages.
- Prefer a single CMS collection with a "Location" field for easier filtering (e.g.,
/stays?location=austria) using Webflow filters or third-party tools; avoid separate collections per location for scalability.
To link your CMS collections ("stays_austria" and "paris") to items on your homepage's travel selection section, you need to connect static elements (like buttons or cards) to corresponding Collection Pages or CMS filters.
1. Identify the Pages You Want to Link To
- When you create a CMS collection in Webflow (e.g., stays_austria), Webflow automatically generates a Collection Page:
/stays_austria/[slug]. - You'll likely want your homepage elements to link to either (a) the CMS item pages or (b) filtered pages that show only Austria or Paris stays.
2. Use Link Blocks or Buttons in the Travel Selection Section
- Use a Link Block or Button for each travel destination (e.g., one for Austria, one for Paris).
- Place static or dynamic content inside these blocks (like images/text).
3. Set Static or Dynamic Link URLs
Depending on your structure:
- Option A: Link to a Filtered Collection List by Tag or Category (Preferred for multiple stays)
- You must add a Category field (e.g., "Location") to a single CMS collection (e.g., call it "Stays") instead of having separate collections for each city.
- Populate "Location" with values like Austria and Paris.
- On your homepage, link buttons to URLs like
/stays?location=austriaand use Webflow’s filters with custom code or third-party filtering tools like Jetboost or Finsweet’s CMS Filter.
- Option B: Link Directly to Collection Pages (One item per city)
- If each collection has only one item, use the slug field of that single item to create a direct link like
/stays_austria/austria-trip. - Set the homepage button’s Link Settings → Page → Collection Page, and choose the individual Collection Item.
4. Publish and Test the Links
- Publish the site, and test the links from your homepage to ensure they correctly open:
- If filtering: only Austria or Paris stays.
- If slug-based: open the individual stay page.
Summary
To link homepage travel selection buttons to CMS items, use Link Blocks connected to Collection Pages or create URL-based filters using a single collection and a category field. Avoid separate CMS collections per location unless absolutely necessary. For better scalability, consolidate your stays in one collection and use filtering.
