# Link Property

The Link Property allows you to configure your button property. You can input a Name and choose a simple or advanced button type. Choose a Layout as required. Choose between Static and Advanced (static and dynamc) data.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FwTS0w12soD04BsIzNoRe%2FScreenshot%202023-09-18%20at%2012.06.49.png?alt=media&#x26;token=8a1b5227-5141-46ce-9b96-291df0a1ee16" alt=""><figcaption></figcaption></figure>

* In the Block Inspector, click "+" to open the Components Properties modal.
* Select the Link Property you wish to configure.
* Open the Settings tab (default).

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FY1YzMTeH1l5mhpUwIgi1%2FScreenshot%202023-09-19%20at%2011.24.40.png?alt=media&#x26;token=a3ee042e-2e11-419c-a90e-9319dcae3bc4" alt=""><figcaption></figcaption></figure>

## Connect

The Link Property you have created 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 Link Property.
* Select "Modify" in the toolbar or the Block Inspector.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2Fury2mxPZFeVN32KEyfHs%2FScreenshot%202023-09-18%20at%2012.08.40.png?alt=media&#x26;token=709c8ed6-a181-416b-bb06-168b2bf86a85" alt=""><figcaption></figcaption></figure>

This will open the component in the navigator so you can access the required block.

* Select required block.
* In the Block Inspector, find the Link Property and click the Component icon.
* Choose required block in the Link dropdown.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2F6N9QE1e2XA0DanAZZmwI%2FScreenshot%202023-09-18%20at%2012.11.03.png?alt=media&#x26;token=e85b5aa2-efec-43c0-aa42-34b37e240b41" alt=""><figcaption></figcaption></figure>

The Link Property will now become green.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FlbQk0DV8azIg9UKVtkhV%2FScreenshot%202023-09-19%20at%2010.19.39.png?alt=media&#x26;token=3c5d3478-0749-4e88-8a41-f9300b60932b" alt=""><figcaption></figcaption></figure>

If the Link property is correctly connected, you should see something like this when in "Customise".

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FEvKzLQDZXVWuaCRjkTll%2FScreenshot%202023-09-19%20at%2010.59.37.png?alt=media&#x26;token=18e769a8-efd5-4c3f-ac53-bf05f7377860" alt=""><figcaption></figcaption></figure>

See [Connect a Component Property](#connect-a-component-property).

## Name

* Input a suitable Name for the Link property

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2F1dczOcs9TRGhwZD9SGAq%2FScreenshot%202023-09-18%20at%2011.50.17.png?alt=media&#x26;token=23279462-6d51-45b6-aae1-6ae6c22776ad" alt=""><figcaption></figcaption></figure>

Once connected, the Link name will appear in the Block Inspector.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2F3AArjzVOvEDatxogbyJu%2FScreenshot%202023-09-18%20at%2011.52.35.png?alt=media&#x26;token=a84e0f23-8771-4471-8c77-381a2f5a2248" alt=""><figcaption></figcaption></figure>

## Simple Type

The Simple Type property allows you to set static data for your Link property.

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

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FAwu6WFkVhUKN5QXWmiRm%2FScreenshot%202023-09-18%20at%2011.56.12.png?alt=media&#x26;token=c0bda0ce-cadb-4515-bb8c-8b4f81168de6" alt=""><figcaption></figcaption></figure>

This will open the Link modal where you can input a link URL.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FVeNRIJBcrmQvnpe9jjEI%2FScreenshot%202023-09-18%20at%2011.58.17.png?alt=media&#x26;token=96df0649-2b37-4483-ba16-843ead459929" alt=""><figcaption></figcaption></figure>

For more information about setting up a Link:

{% content-ref url="../../../interactions/link-wrapper" %}
[link-wrapper](https://docs.cwicly.com/interactions/link-wrapper)
{% endcontent-ref %}

## Advanced Type

The Advanced Type property allows you to add dynamic or static content to your link as required.

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

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FDffEjUV1lIUVjV4XJdPS%2FScreenshot%202023-09-18%20at%2012.02.23.png?alt=media&#x26;token=275f4dbb-e2cf-475e-a134-6fc9d693ddf9" alt=""><figcaption></figcaption></figure>

Now a Dynamic icon appears in the Block Inspector that will allow you to toggle on or off Dynamic content.

* In the Block Inspector, toggle dynamic on for dynamic content.
* This will open the Link modal.
* Input settings as required.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2F6rbLQx5OcxIxbvYus93x%2FScreenshot%202023-09-18%20at%2012.04.33.png?alt=media&#x26;token=f141be32-f37e-439e-8ea3-401450445d7c" alt=""><figcaption></figcaption></figure>

See:

{% content-ref url="../../../interactions/link-wrapper" %}
[link-wrapper](https://docs.cwicly.com/interactions/link-wrapper)
{% endcontent-ref %}