List Tag Choose between ul and ol tags when creating a List. Important Notes: The ul tag is for grouping a collection of items that do not have a numerical ordering, and their order in the list is meaningless. On the other hand, with the ol tag, the order is meaningful. Demo

UL

  • Item
  • Item
  • Item

OL

  1. Item 1
  2. Item 2
  3. Item 3
Twig
{% set list_items %}
  {% include '@bolt-elements-list/list-item.twig' with {
    content: placeholder_1,
  } only %}
  {% include '@bolt-elements-list/list-item.twig' with {
    content: placeholder_2,
  } only %}
  {% include '@bolt-elements-list/list-item.twig' with {
    content: placeholder_3,
  } only %}
{% endset %}

{% include '@bolt-elements-list/list.twig' with {
  tag: 'ol',
  content: list_items
} only %}
HTML
<ol class="e-bolt-list">
  <li class="e-bolt-list__item">First item</li>
  <li class="e-bolt-list__item">Second item</li>
  <li class="e-bolt-list__item">Third item</li>
</ol>