Articles on: CMS Integrations

How to use the CMS list element

CMS lists are one of the basic building blocks for any CMS project.


They are designed to display the data from multiple items from an imported collection, in the form of a list.


Lists can be found by default in CMS List pages, but they can be added to non-cms pages as well.


  1. Adding a CMS list to a project
  2. CMS list options
  3. Adding elements to list items
  4. Styling CMS lists
  5. Styling CMS list items


Adding a CMS list to a project


CMS lists can be added either to a CMS page or a regular page.


To add list to a project:


  • Go to the Left panel -> Elements tab -> CMS section
  • Drag the CMS List element to a page
  • Go to the Right panel -> Collection settings
  • Select a Source from one of the collections that you imported


The sources available to set up the List will be the collections imported when establishing the CMS connection.


Adding a CMS list to a project


CMS list options


From the **Right panel -> Collection settings **where you also set the source for the CMS list you have several options to customize the list.



CMS List available customization options


Adding elements to list items


To add new elements to a CMS list item:


  • From the Left panel -> Elements
  • Drag any element to the Success layer of the CMS List
  • Select the element
  • Go to the Right panel
  • Click on the Bind property icon to bind dynamic data to the element


Check out this article to learn more about How to bind dynamic data to elements.


Adding elements to a CMS list


Styling CMS lists


To make styling changes to the list itself:


  • Go to the Left panel - Layers and Files
  • Expand the Main list element
  • Expand the Success layer
  • Select the List layer
  • From the Right panel you can style the list like any other container


Styling CMS lists


Styling CMS list items


To style a CMS list element:


  • Select the elements in Success -> List -> Items
  • Style the elements using the Right panel, like any other element


The most important thing to remember is that editing one CMS item in a list will affect all of the other elements in the list as well.


Styling items in a CMS list

Updated on: 28/03/2025

Was this article helpful?

Share your feedback

Cancel

Thank you!