Dynamic Collection Pages
Dynamic pages are automatically generated based on data from collections. A separate page is created for each collection element, where you can display data from its fields.
Dynamic page is a design template for all element pages. You only need to design only one of the pages, and it will be applied to all the others automatically. This way, you will get a set of collection pages that are identical in design but different in content.
In Taptop you can create any design of dynamic page, fully customizing all elements.
Example:
1. Add a dynamic page for the “Services” collection. A separate page is created for each service.
2. Create a design for one of the service pages - it will automatically be applied to all service pages.
What are the advantages of dynamic pages
- Automatic creation of new pages. If you add a new element/item to a collection, a new page is automatically created for it. For example, if you add 100 services to the table, a page will be created for each of them — 100 pages will be added to the site.
- Automatic design update on all pages. If you change the design on the page of one element/item, the design of all element/item pages in the collection will be updated automatically.
If you don't need separate pages for each element/item in the collection, there's no need to create dynamic pages.
Go to the Pages tab (left panel) and click the New Page button. In the list, select CMS Page, then choose the name of your collection and click on Dynamic Page.
A set of dynamic pages will be created in the project — one for each element/item in the collection. In the page structure, dynamic pages are nested under the index page of your collection and are marked with a special icon indicating their connection to the collection.
If the index page has not yet been created for the collection, when dynamic pages are added, they will be placed in the folder with the collection name.
You can view the list of all dynamic pages in the collection and switch between them using the list located above the canvas.
The collection item page is initially empty — it does not contain the Collection widget, as it will only display the fields of the specific item.
You need to add elements to the canvas where the collection field data will be displayed.
To create the desired page design, you can structure it in any way — add blocks like Section, Container, etc., to the canvas, and then place the necessary elements inside them
For the "Services" collection, you will need two text elements and an image.
The added elements will appear on all dynamic pages of the collection.
To transfer data from the collection to the corresponding elements, you need to create a connection between them.
To do this, select one of the elements on the canvas or in the layers (e.g., Text). Go to the Settings (right panel) and, in the Dynamic data section, open the Binded field dropdown. By default, it is set to "None" because the element is not linked to any field.
Select the field you want to link to the element from the list (e.g., "Title").
The data from the selected field will automatically populate into this element on the canvas. An icon will appear in the corresponding layer, indicating that the element is linked to the collection field.
Similarly, link the corresponding collection fields to the other elements.
Until you link a collection field to an element, it will remain static, and the data in it will not update dynamically.
Done! You have created the dynamic pages for the collection.
Onto each page of the collection element, the data corresponding to them will be pulled. You can verify this by switching between the dynamic pages using the list above the canvas.
To apply all changes, save the page (Ctrl + S) and click the Publish button, or use the shortcut Ctrl + Shift + S (save and publish).
Dynamic pages do not have a single URL because each page's URL is generated separately based on the collection slug and the item slug. Therefore, when you publish a dynamic page, the URL will not be displayed in the popup.
To access the settings, click on the icon to the right of the page name.
The page settings panel will open.
How do the settings for a dynamic page differ from a standard page
- There is a Collection field with the name of the collection that the page is based on. It cannot be edited.
- The Slug field cannot be changed — its value is automatically generated based on the slug of the collection element/item.
- The Metatag Title field (Title) cannot be modified — its value is pulled from the Title field of the collection element/item.
- The page cannot be duplicated or set as the homepage.