# ID Property

The ID Property gives an ID to the block if you wish to give it a specific name in order to target it more easily (for example to connect it to a modal).

By default the Block ID is indexed relative to the number of blocks on the page.

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

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

## Connect&#x20;

The ID Property needs to be connected for it to be applied to the canvas.&#x20;

{% 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 ID Property.
* Select "Modify" in the toolbar or the Block Inspector.

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

* The blocks contained in the component are now visible in the navigator.
* Find and select the block to which you wish to connect an ID Component Property.
* In the Components tab of the Primary tab, find ID.

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

* Click the ID Content field to open the Component Properties modal.&#x20;
* Select the ID property you wish to connect.
* Click the Connect button.

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

The ID Property will be visible in green in the Block Inspector.

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

## Customise

To customise the ID Property, make sure that Customise is selected in the Tool Bar.

* Select required Component in the navigator.
* In the Block Inspector, input a suitable name in the ID field

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

## Name&#x20;

Allows you to label the selected ID property.

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

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

## Placeholder&#x20;

Ensures that suitable alternative text appears in the ID field of the block inspector if the ID field has been cleared or is empty.

* Open the Components Properties.
* Select required ID property.
* Open Settings tab.
* Input suitable text to Placeholder field such as "Enter ID".

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

The Placeholder text will now appear in the ID field of the Block Inspector.

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

## Auto Generate

The Auto Generate property, when enabled, will automatically choose a name for your ID.

* In the Components Properties modal, Toggle on/off Auto Generate as required.

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

The Auto Generated ID will now be visible in the Block Inspector ID field.

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

If the Auto Generated ID is not acceptable, click the Reset button to the left of the ID label. This will Auto Generate a new ID.

* With the required component selected, n the Block Inspector, find the ID and click the Reset button to generate a new ID.

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

## Simple Type

The Simple Type property allows you to input static data.

* Open the Components Properties.
* Select required ID property.
* Open Settings tab.
* Select Simple as Type.

![](/files/xNGFeMYqM9ZL0CljjFZ7)

The simple (static) data will now look something like this.

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

## Advanced Type

The Advanced Type property allows you to input dynamic or static data as required.

* Open the Components Properties modal.
* Select required ID property.
* Open Settings tab.
* Select Advanced as Type.

![](/files/QFHv4B1DyOIIrJhtsvu8)

* Make sure you are in Customise.
* In the Block Inspector, click the Dynamic icon next to ID label.

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

* This opens the Dynamic modal.
* Fill in the dynamic data fields.

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


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.cwicly.com/cwicly/components/properties-add/id-property.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
