Webflow - Collections and CMS
1h 50mBeginner2023-08-04
Authors
Jen Kramer
Teaches web design and development
Course details
Webflow allows you to create professional-looking websites without writing a single line of code. It also lets you manage large amounts of repetitive content using a customizable database called a collection. In this course, instructor Jen Kramer shows the basics of how to add, organize, and manage a structured collection behind your Webflow interface.
Explore the advantages of using collections to sort complex information and how to display collection lists, detail pages, and more. Jen offers pointers and practical strategies to apply category filters and display collections as you go. Along the way, test out your new technical know-how in the practice challenges at the end of each section. By the end of this course, you’ll be prepared to take your Webflow skills to the next level and design more dynamic content for your site.
Explore the advantages of using collections to sort complex information and how to display collection lists, detail pages, and more. Jen offers pointers and practical strategies to apply category filters and display collections as you go. Along the way, test out your new technical know-how in the practice challenges at the end of each section. By the end of this course, you’ll be prepared to take your Webflow skills to the next level and design more dynamic content for your site.
Skills covered
WebflowPrototypingContent Management Systems (CMS)ProjectProduct and ManufacturingWeb Development
Concepts
0. Introduction
- 01 - Next-level Webflow with collections
- 02 - Setting up the starting state
1. Organizing Information in a Collection
- 03 - What is a collection and how does it work
- 04 - What kind of fields are available in a collection
- 05 - Review the starting content and organize it
- 06 - Create your tour collection
- 07 - Populate your collection
- 08 - Challenge - Creating the tour guide collection
- 09 - Solution - Creating the tour guide collection
- 10 - Connecting the tour collection and tour guide collection
2. Displaying Collection List and Collection Detail Pages
- 11 - Connecting the tours page to the tours collection
- 12 - Replacing static fields with dynamic collection fields
- 13 - Combining static labels with dynamic values
- 14 - Setting up the tour detail page
- 15 - Challenge - Completing the tour detail page
- 16 - Solution - Completing the tour detail page
- 17 - Adding tour guides to the tour detail page
3. Filtering and Displaying Collections
- 18 - Challenge - Configuring tour categories on the home page
- 19 - Solution - Configuring tour categories on the home page
- 20 - Using filters to select items for the home page
- 21 - Sorting and ordering collection items
- 22 - Applying CMS filter to the collection page
Conclusion
- 23 - Learning more about Webflow