How can I link my latest work section on the homepage to CMS pages in Webflow?
TL;DR
- Add a Collection List to your homepage and connect it to your CMS Collection.
- Insert dynamic elements (like images or titles), wrap them in a Link Block, and set the link to “Current Collection Item” to link to individual CMS pages.
- Optionally, apply filters and limits to show only the latest items, and style the section as needed.
To link a Latest Work section on your homepage to specific CMS pages in Webflow, you need to use a Collection List that connects to your CMS items. Here's how to do it:
1. Add a Collection List to the Homepage
- Open your homepage in the Webflow Designer.
- Click Add (+) > Collection List and drag it into your desired section (e.g., Latest Work).
- In the Collection List settings, connect it to your CMS Collection (e.g., Portfolio, Projects, Blog Posts).
2. Add Dynamic Content to Each Item
- Inside the Collection List, insert elements like:
- Image (bind to a CMS image field)
- Text Block or Heading (bind to the name/title field)
- These will display each CMS item’s content dynamically.
3. Link Each Item to Its CMS Page
- Select the element (e.g., a Text Block or Image) you want to make clickable.
- Wrap it in a Link Block (right-click > Wrap in Link Block).
- With the Link Block selected, go to the Element Settings panel.
- Under Link Settings, choose "Current [Collection Item]" from the Page dropdown.
- This links each item to its individual CMS page by default.
4. Use Filters or Limits (Optional)
- If you want to show only the latest work:
- Select the Collection List and go to Collection List Settings.
- Add a Sort Order (e.g., sort by Created Date > descending).
- Set a Limit (e.g., 3 or 6 items).
5. Style the Section
- Customize the layout and design to match your homepage styling.
- If needed, stack elements inside the Link Block (title, image, etc.).
Summary
Use a Collection List on your homepage, connect it to your CMS Collection, and wrap key elements in a Link Block pointing to the Current Collection Page. You can also add filters or limits to only show the latest work.