> For the complete documentation index, see [llms.txt](https://docs.cwicly.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.cwicly.com/cwicly/components/properties-add/list-property.md).

# List Property

The List Property allows you to add a list to a component. Input required information such as Name, Default, Placeholder, Canvas Placeholder.&#x20;

Choose Type as required, simple or advanced.

Below is an example of what the Components Properties modal will look like once filled out.

<figure><img src="/files/iNTgQPE0YSR2WUujsLoZ" alt=""><figcaption></figcaption></figure>

* Open the Components Properties modal by clicking the "+" icon in the Block Inspector.
* Select the List Property you wish to configure.

<figure><img src="/files/YgaLXfsiHDQQXTwavSqU" alt=""><figcaption></figcaption></figure>

## Connect&#x20;

The List Property needs to be connected for it to be applied to the canvas.

{% hint style="info" %}
You need to select "Modify" in the Toolbar or Block Inspector for the blocks that make up a particular component to be visible.
{% endhint %}

* Select the Component to which you want to connect the List Property.
* Select "Modify" in the toolbar or the Block Inspector.

<figure><img src="/files/QwsJd6Ij8gFqBAMSHgU7" alt=""><figcaption></figcaption></figure>

* The blocks contained in the component are now visible in the navigator.
* In the navigator, find and select the List property you wish to connect.
* In the Components tab of the Primary tab, click the Content field to open the Component Properties modal.&#x20;

<figure><img src="/files/gu3ZKstkYS5gsRQE1uDp" alt=""><figcaption></figcaption></figure>

* In the Component Properties modal, select the List property you wish to connect.
* Click the Connect button.

<figure><img src="/files/R6TkBk1lzeJeaJK4u4uY" alt=""><figcaption></figcaption></figure>

* The List Property name is now visible in the Content field in the Block Inspector.

<figure><img src="/files/dC4q8Xgsmnu0TWRG6HsH" alt=""><figcaption></figcaption></figure>

Once correctly connected, you should have something like this:

<figure><img src="/files/YH6MjUKCe5EBa7yGGheJ" alt=""><figcaption></figcaption></figure>

## Name&#x20;

Allows you to label the selected List property.

* Open the Component Properties modal.
* Select required List property.
* Input suitable label name to Name field.

<figure><img src="/files/cIRYh78sL1PJbKphlruU" alt=""><figcaption></figcaption></figure>

The required label will now be visible in the Block Inspector next to the list field.

<figure><img src="/files/X5aBFnAD6ipFXvQAjet1" alt=""><figcaption></figcaption></figure>

## Default

Allows you to set suitable default text to your component.&#x20;

* Open the Components Properties.
* Select required List property.
* Open Settings tab.
* Input suitable default text in Default field.

<figure><img src="/files/ewAhpIBp93gQLtJLeMVu" alt=""><figcaption></figcaption></figure>

This is how it should now look on the canvas.

<figure><img src="/files/ktFhwpMo8fDz6IDtjmZX" alt=""><figcaption></figcaption></figure>

## Placeholder&#x20;

Ensures that suitable alternative to the list appears in the list field of the block inspector if the list field has been cleared.

* Open the Components Properties.
* Select required List property.
* Open Settings tab.
* Input suitable text in Placeholder field such as "Write Here".

<figure><img src="/files/tADsiHIgzcdWRPQ0Zc4y" alt=""><figcaption></figcaption></figure>

The placeholder text will now be visible in the required field of the Block Inspector.

<figure><img src="/files/FP1ET6qMahFwqXYTxKfT" alt=""><figcaption></figcaption></figure>

## Canvas Placeholder

Alternative text that appears in the List field of your post or page if the required List has not been added.

* Open the Components Properties.
* Select required List property.
* Open Settings tab.
* Input suitable text to Canvas Placeholder field, such as "Write List Here".

<figure><img src="/files/PK3kZBMntlVD4NTK8vT5" alt=""><figcaption></figcaption></figure>

The canvas should look something like this now.

<figure><img src="/files/WMsFugNRadVqVQ6pWWtv" alt=""><figcaption></figcaption></figure>
