How do I set up a folder in Webflow that contains an index page and points to subpages?

Published on
September 22, 2023

To set up a folder in Webflow that contains an index page and points to subpages, you can follow these steps:

  1. Create a new collection: If you haven't already, create a collection to hold the subpages you want to include in the folder. This is necessary because the folder will be a dynamic page that fetches data from this collection.

  2. Set up the collection fields: Inside the collection settings, specify the fields you need for each subpage, such as title, content, images, etc. You can customize these fields according to your requirements.

  3. Create the folder collection: In the Collections panel, click on the "+" button to create a new collection. Give it a meaningful name, such as "Folder" or "Section."

  4. Configure collection settings: In the collection settings, you can set the Slug to be the desired URL structure for your folder. For example, if you want the folder to be located at "example.com/folder," you would set the Slug to "folder". You can also customize other settings as needed.

  5. Add collection fields: In the collection settings, add any fields that you want to display on the index page of the folder. This could be a title, description, or any other relevant information.

  6. Create the index page: Now, go to the Pages panel and create a new page for the index of your folder. Make sure to choose the collection you just created as the Page Type.

  7. Design the index page: Once you've created the index page, you can design it just like any other page in Webflow. Use the collection fields to display the information you want on this page, such as a list of subpage titles or thumbnails.

  8. Create the subpages: To create the subpages within the folder, go to the Pages panel and create new pages. Set the Page Type of each page to the collection you created for the subpages.

  9. Link the subpages to the index page: In the collection settings, you can set up a Reference field that links the subpages to their parent index page. This will create a relationship between each subpage and the folder it belongs to.

  10. Set up dynamic lists: In the index page, you can use dynamic lists to display the subpages as links or featured content. With dynamic lists, changes in the subpage collection will automatically update on the index page.

By following these steps, you can easily set up a folder in Webflow that contains an index page and points to subpages. This structure allows for easy management and navigation within your website.

Additional Questions:

  1. How do I create a collection in Webflow?
  2. Can I customize the URL structure of dynamic pages in Webflow?
  3. How do I display dynamic content on a Webflow page using collection fields?