After exporting your components to a styleguide, you’ll find them listed under the Individual components page in the Components section.
When working with a large number of components, it can become challenging to keep track of them. Using Component Pages helps you organize and group components based on their intended features, making it easier to manage them within your styleguide.
💁♀️ If you’re exporting component variants set up in Figma, Zeplin will automatically create a page and collect all the variants under a variant section on this page. Learn more here: Setting up Component Variants from Figma
Creating a page from the Individual components or All pages
To create a page from the Individual components, you can select a component or multiple components, right-click, and select “Create page”. You’ll also see the “Create page” button on the footer.
This will create a new page with a component section, and you’ll be able to enter a name for both the page and section based on how you’d like to group your components.
Under All pages, you'll find a list of all your component pages. If you want to combine multiple pages into a new one, you can search and select them, then click the "Create page" button on the footer menu.
This will create a new page and move the sections under the selected pages to the new page.
If you’d like to further organize your components on a component page, you can also create new sections and subsections. You can learn more here: Organizing components using Sections and Subsections under a component page
Creating an empty page
You can also create an empty page first and then move components into it.
To do this, hover over your styleguide name under Components in the left panel. Click the ⊕ icon that appears to create a new component page.
To move your components into this blank page, you can follow the steps here: Moving components between Pages
Converting a section to a page
If you have a component page including multiple component sections, you may want to convert some sections into new pages to further organize them in separate pages. To do this, click on the "..." options menu button of a section and select the "Convert section to page" option.
It is also possible to convert all sections within a page into separate pages at once. You’ll see the "Convert all sections to pages" option under the "..." options menu of the page.
Sharing component pages
You can share the link of a component page with other users in the styleguide. Click on the "..." options menu and select “Copy page link”.
Deleting a page
To delete a page, select “Delete page” under the “…” options menu. This will prompt you to delete the page itself or delete it with the components. If you only delete the page, your components will be moved to the “Individual components” page.