# Collapsible content

Source: <https://docs.ictsviluppo.example/dossier/sections/section-collapsible-content/>

Collapsible content is a list of questions that open and close, one at a time or all together. Use it for frequently asked questions about shipping, returns, sizing or care, on the home page, on a contact or help page, or anywhere customers look for answers.

## Add the questions

Each question is a **Collapsible row** block, with a **Heading** for the question and **Content** for the answer. You can add up to 16 and drag them into the order you want. A new section starts with three example questions about shipping, returns and sizing: replace their text with your own policies.

Each row opens and closes on its own, so customers can keep several answers open at once. The rows work with the keyboard and with screen readers, even with JavaScript turned off. The questions are headings, so screen reader users can jump from one to the next.

Turn on **Open first row** to show the first answer when the page loads.

## Help search engines read your answers

**Add FAQ structured data** is on by default. It describes each question and its answer in a form that search engines and AI assistants, such as ChatGPT or Perplexity, can read and quote. Only rows with both a question and an answer are included. Turn it off if you use the section for something other than questions and answers. If a page has more than one Collapsible content section, keep your questions in one of them.

## Write the heading and introduction

**Caption**, **Heading** and **Text** introduce the questions. They are section settings, so there is only one heading and it always comes first. The heading also names the section for screen readers. Use **Text** to point customers to more help, for example a link to your contact page.

## Put the heading beside or above the questions

**Layout** has two choices:

- **Heading beside questions**: on computers the heading sits on one side and the questions on the other. The heading stays in view while customers scroll through a long list.
- **Heading above questions**: everything in one column.

On phones and tablets both layouts show a single column. In right-to-left languages, such as Arabic and Hebrew, the two sides swap automatically.

## Show it only between two dates

Turn on **Schedule visibility** and set a start, an end, or both, for example for questions about holiday shipping. See [Scheduling](https://docs.ictsviluppo.example/dossier/scheduling).

## Settings

| Setting | Type | Default | Options |
| - | - | - | - |
| **Caption** | Text | FAQ | — |
| **Heading** | Text | Frequently asked questions | — |
| **Text** | Rich text | — | — |
| **Open first row** | Checkbox | Off | — |
| **Add FAQ structured data** — Helps search engines and AI assistants read the questions and answers. Turn off if the rows aren't questions. | Checkbox | On | — |
| **Layout** | | | |
| **Layout** | Drop-down | Heading beside questions | Heading beside questions, Heading above questions |
| **Use full page width** | Checkbox | On | — |
| **Vertical spacing** | Drop-down | Regular | Compact, Regular, Spacious |
| **Color scheme** | Color scheme | scheme-1 | — |
| **Schedule** | | | |
| **Schedule visibility** | Checkbox | Off | — |
| **Start date and time** — Use the format YYYY-MM-DD HH:MM, in your store's time zone. Leave empty to show it right away. Shown when *Schedule visibility* is on | Text | — | — |
| **End date and time** — Use the format YYYY-MM-DD HH:MM, in your store's time zone. Leave empty to keep showing it. Shown when *Schedule visibility* is on | Text | — | — |

## Blocks

### Collapsible row

| Setting | Type | Default | Options |
| - | - | - | - |
| **Heading** | Text | Collapsible row | — |
| **Content** | Rich text | Use this block to answer a common question. | — |
