# Tab List

{% hint style="info" %}
By default the `tab list` block includes a `tab` block with a `heading` block inside.
{% endhint %}

## Basics

The `tab list` block allows you to regroup several `tab` blocks in one place. 

<figure><img src="https://lh3.googleusercontent.com/cfU3MQeXrkzgoVViGFzlOWDBERdh1xo2DV31ZC0ib6FZk6st4NnCVuFQYdi1Nr_l5NJicpAuzUeoavoCaKTSECQM5VvPWsDZO6p0NrK1gYORYbOS5PpIb_H4kQtw4UkCS9Nx4nqhaq3EeoJGBdgvCn_DDn5RtKLFIF-gxk_xkH8qOFgOO_drvdSy1rkGeg" alt=""><figcaption></figcaption></figure>

## Add a Tab List

You can add a `tab list` block inside an existing block or outside any other block on the page.

<figure><img src="https://lh6.googleusercontent.com/TPJeAUKkD3zyk908sP8pvNqFrnMxvIcoDUTlhNnZsUK6KgTNzSpMrQrx9vQrNsrFzeV0uGClguY9fLfZIIU8RNTvfY0soFqJK7IXKFWruZrBz3n9ih8qeeP8K1BKFarYVjJcLzeJsSOVver3oRXAMYTFvS0SRG5lPm9pJnnkBhbmJbSTv4x8uidc7NuHGw" alt=""><figcaption></figcaption></figure>

<figure><img src="https://lh3.googleusercontent.com/C0ytBKBLR1JOEII9-YEAdFAuNKw9skkDGWvj7RlHbBLdUnRKfE0mVTGpYqqd90V4XyCnpKOvrdy_dgB2ucM9GvAY_ih4dxaF-jDIfTXb_QcB0V5WLXyOTO1IQvkMovljVUAO8kHMfyO_1r0AksSuebQBjxGeWtcQdCP8sSRlBDtOHE06l1Vk_OvjKvK3yw" alt=""><figcaption></figcaption></figure>

<details>

<summary>Add</summary>

If you want to add a tab list outside any other block on the page:

1. Click on the ➕ ​​icon to open the Inserter Panel
2. Search for the Cwicly tab list block
3. Click on the Cwicly tab list block to insert it into your page

If you want to add a list inside a parent block:

1. Open the Quick Insert panel in the parent block
2. Search for the Cwicly tab list block
3. Click on the Cwicly tab list block to insert it into your parent block

</details>

{% embed url="<https://www.youtube.com/watch?v=-SbWB9PMGBs>" %}
Getting Started - Tab Block
{% endembed %}

## Settings

Allows you to set specific settings for the `tab list` block.

<figure><img src="https://lh6.googleusercontent.com/XRZwcxtLwE2okL3z1QA_PJVpHu28C4iq6_MaGhhkem0i5yjL2VBBBXuN_VSPZ68tcD2ecK9hoy6RDElS0TzpC46tbN8qSl8G422_0lNN7ZglGEa49FSO1efVBt0wER_NYzK-5J-4N0HxytsxjByimpgLXacMOPuynQ9_IBWERpae_uxPnIABO_BamDv3bw" alt=""><figcaption></figcaption></figure>

### Tab Contents ID

The Tab Contents ID property enables you to link the the `tab list` and `tab contents` block together.

This gives you total freedom as to where you place your tab list and tab contents.

Copy the ID of the `tab content` block you wish to link to your `tab list` block.

![](https://lh5.googleusercontent.com/ytUrWxmV24xdlP_Xls3Z1dcrxjoY2-5vyiac56DZ9wHlAY4lsGcmmDPOfjhvMcH6sRwUHaJQlr1pyMRKIdt8me7jjJsF8l-dI6UDf9t-fR-8TomSzlZf7I3KtKKqE6w3YIKkzG7v0sqIXeSkiX1qjDVlRGE_XB1mmMwx2C1kH7geAVhtx96nNUFZvQYt4g)

<details>

<summary>Modify</summary>

1. Select a `list tab` block
2. Open the Block Inspector
3. Navigate to the Primary tab
4. Open the settings tab&#x20;
5. Find the Tab Contents ID property
6. Enter the Tab Contents ID

</details>

<details>

<summary>Reset</summary>

1. Select a `list tab` block
2. Open the Block Inspector
3. Navigate to the Primary tab
4. Open the settings tab
5. Find the Tab Contents ID property
6. Click dot to reset

</details>

### Active Tab

The Active Tab property allows you to select the which tab is open when the user first loads the page.

![](https://lh3.googleusercontent.com/zVbVPk48Zzwc6UKWNIY7TkDc18jS7cAxd_2TAOMdWgetJUlW-vxNUHP1TOAApv5kNQxUFjkNQQq2nUTE3QZr3Ysh_bK8ddOPNw1NKlAuClS8NGLo5HpsVUXO96ec5MwlyWMH3fQBo5jJ3ioqOdVdLd1OMT9sA9zijSyiXzP95AO-JiPGs9wuWuIjZrIczQ)

<details>

<summary>Select</summary>

1. Select a `list tab` block
2. Open the Block Inspector
3. Navigate to the Primary tab
4. Open the settings tab&#x20;
5. Find the Active Tab property
6. Select the desired number from the Dropdown menu

</details>

<details>

<summary>Reset</summary>

1. Select a `list tab` block
2. Open the Block Inspector
3. Navigate to the Primary tab
4. Open the settings tab
5. Find the Active Tab property
6. Click dot to reset

</details>

### Show All (Backend)

The Show All (backend) property opens all the tab contents at the same time, which allows you to see  your different tabs and contents on the backend for editing purposes.

![](https://lh4.googleusercontent.com/WyZ6hTeJa3f9WBJ__n6P1IYm1jfmWi-H27FGeMvPD6WCckYIaryhFUY55UvIEQEbgIfm8P-yu2mbfQA6ANN8ZEuKjGoDTZECYqwkJNolQekkaKcxtbb5l5dha-jWbVuGSBD8u9HQelzmN2JNrNn-FFmYB2Z07GWK1Sk2er7_ZMldtaSXiBVce7yCDtDAOQ)

<details>

<summary>Activate/Deactivate</summary>

1. Select a `list tab` block
2. Open the Block Inspector
3. Navigate to the Primary tab
4. Open the settings tab&#x20;
5. Find the Show All (backend) property
6. Toggle the property in order to activate/deactivate

</details>

## Tab

Tabs are a navigation element that allow users to easily access different areas of a site or different parts of an individual page.

{% content-ref url="/pages/rBOqQSjwAS0MM16hkNUa" %}
[Tab](/blocks/tab-list/tab.md)
{% endcontent-ref %}


---

# 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/blocks/tab-list.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.