CanvasFunctionsCanopy

cms_list

The cms_list function is used to define a list component which can be edited on the Canopy editor.

{{ cms_list(name, { ordered: ..., items: [ '...', '...' ], class: '...' }) }}
ArgumentDescriptionData Type
nameThe element identifierString
ordered (optional)Set ordered list or unordered listBoolean
items (optional)Array containing the content of each list itemArray[String]
class (optional)A space-separated list of CSS classes to style the list componentString

The class variable is only accessible in the code. All other variables are available in the Canopy editor.

List component template

<{{ ordered ? 'ol' : 'ul' }} class={{ class }}>
  {% for item in items>
    <li>{{ item }}</li>
  {% endfor>
</{{ ordered ? 'ol' : 'ul' }}>

Rendered HTML output

<ol class="bg-pink">
  <li>Item 1</li>
  <li>Item 2</li>
</ol>

Example

index.html
{{ cms_list('list-tag-123', { ordered: true, items: [ 'Item 1', 'Item 2', 'Item 3' ], class: 'list-decimal pl-5 space-y-2' }) }}

Last updated on