CMS: Setting Up a Dynamic Item Page
7 min read
A dynamic item page is a single page design that you can use over and over to display items from your collection. You can edit this page by adding more elements, or deleting existing elements from it. You always have full control of how your elements connect to content in your collection. Use the page URL to link to it via menu items or buttons. To control what content gets displayed, modify the URL.
If you already have a dynamic item page that you want to set up differently, you can skip to Step 2.
(Optional) Step 1 | Add a dynamic item page
Create a new dynamic item page from the collection you've already created.
To add a dynamic item page:
- Go to CMS in your Editor:
- Wix Editor: Click CMS on the left side of the Editor.
- Editor X: Click CMS at the top of Editor X.
- Click Collections.
- Click the More Actions icon next to the relevant collection and click Add Dynamic Item Page.
(Optional) Step 2 | Add or delete elements
A new dynamic item page includes elements that will display all the content of an item in your collection. If you want to use these elements as they are, skip to the next step. If you would rather design the page yourself, you can add new elements and delete the ones you don't want.
To add elements:
- Go to the Add panel:
- Wix Editor: Click Add on the left side of the Editor.
- Editor X: Click Add Elements at the top of Editor X.
- Click the element you want to add to your page.
- Click the element on your page.
- Click the Connect to Data icon (or in Editor X).
- Select the fields from your collection in the drop-down menus under Connection Options.
Step 3 | Check connection of the elements
The elements on your page should already connect to the correct fields in your collection. But it's always recommended that you check everything is set up in the right way.
To check the connections on your page:
- Click an element in your Editor.
- Click the Connect to Data icon (orin Editor X).
- Check each of the fields under Connection Options. If necessary, click to change the connection.
Step 4 | Modifying the URL
The URL of a dynamic item page acts as a filter to control which item gets displayed on the page. For a new dynamic item page, the first field in the collection is the filter (this is usually 'Title').
So, for a collection with a title field containing the name of each recipe, the URL for each dynamic item page will be based on the recipe name.
For a collection with a title field that contains the number of each recipe, the URL will be based on the recipe number.
To modify the URL of your dynamic page:
- Go to Site Pages in your Editor:
- Wix Editor: Click Menus & Pages on the left side of the Editor.
- Editor X: Click Pages at the top of Editor X.
- Click Dynamic Pages.
- Select the new dynamic page and click the More Actions icon .
- Click Settings.
- Under What's the page URL?, remove the last part of the URL that appears after the dash (/). Make sure you do not remove the part of the URL that appears before the /.
Note: If you see a warning that reads 'This URL conflicts with an existing URL', you can ignore it, and continue with the next steps.
- Click Add Field.
- Select the field you want to filter by. This is known as the dynamic value.
- Click the field you just added. The name of the field (the dynamic value) is now displayed between parentheses at the end of the URL. The collection field you add determines the items displayed on your dynamic item page. In the example below, the collection field is 'Recipe Number'.
- Return to the page in the Editor. Click the on-screen drop-down and select the collection item to display on your dynamic item page.
- Use the on-screen drop-down to switch between items in Preview mode to see how your page will look live.
Step 5 | Link to dynamic pages
Now that you have a dynamic page set up, make it available to your site visitors. Add a link to your site menu or add a linkable element on any of your site pages, so your visitors can access the page. Learn more about linking to a dynamic page.
You can also create an index page for your dynamic pages. An index page is made of static elements that link to your dynamic pages.