#
List
The List block allows you to create unordered and ordered lists of text and information in a well formed and semantic way.
#
Basics
The List block only allows text content.
The List block is a quick way to create lists of text that sit on top of each other.
You can add a new line to the list by pressing the Enter key.
If you want to add a list outside any other block on the page:
- Click on the ➕ icon to open the Inserter Panel
- Search for the Cwicly List block
- Click on the Cwicly List block to insert it into your page
If you want to add a list inside a parent block:
- Open the Quick Insert panel in the parent block
- Search for the Cwicly List block
- Click on the Cwicly List block to insert it into your parent block
#
Icons
When activated, the Icon
property allows you to choose whether you want the list bullet to be an icon.
- Select a List block
- Open the block inspector
- Navigate to the primary tab
- Open the Icons tab
- Find the Icon property
- Toggle the Icon property
#
Select Icon
Use the Icon Selector to select the desired icon.
- Select a List block
- Open the block inspector
- Navigate to the primary tab
- Open the Icon panel
- Find the Icon property
- Click on the 🌏 icon to open the Icon Selector
#
Specific Icons
The List block allows you to choose specific icons for every list element.
- Select a List block
- Open the block inspector
- Navigate to the primary tab
- Open the Icon panel
- Click on the Specific Icons
icon
- Find the List element you want to define an icon for
- Toggle the List Icon x property (x being the position of the element in the list)
- Select an icon using the Icon Selector
#
Spacing
The Spacing
property allows you to define the margin added between the icon and the text.
- Select a List block
- Open the block inspector
- Navigate to the primary tab
- Open the Icon panel
- Find the Spacing property
- Enter the desired value
#
Icon Size
The Icon Size
property defines the size of the icon.
- Select a List block
- Open the block inspector
- Navigate to the primary tab
- Open the Icon panel
- Find the Icon Size property
- Enter the desired value
#
Vertical Position
The Vertical Position
property allows you to define the vertical position relative to the text element in the list.
- Select a List block
- Open the block inspector
- Navigate to the primary tab
- Open the Icon panel
- Find the Vertical Position property
- Enter the desired value
#
Icon Color
The Icon Color
property allows you to define the icon color.
- Select a List block
- Open the block inspector
- Navigate to the primary tab
- Open the Icon panel
- Open the color picker by clicking on the color circle
- Select your color in the color picker or click on a global color
#
List
#
Inline List
The Inline List
property allows you to define whether you want to make your list horizontal instead of vertical.
- Select a List block
- Open the block inspector
- Navigate to the primary tab
- Open the List panel
- Find the Inline List property
- Toggle the Inline List property
#
Spacing
The Spacing
property allows you to define the margin added between every list element.
- Select a List block
- Open the block inspector
- Navigate to the primary tab
- Open the List panel
- Find the Spacing property
- Enter the desired value
#
Indent
The Indent
property allows you to define the margin added to the left of the list element to indent it.
- Select a List block
- Open the block inspector
- Navigate to the primary tab
- Open the List panel
- Find the Indent property
- Enter the desired value