# Collapsible content

### Section overview

The Collapsible content section displays a list of collapsible content blocks that can be expanded and collapsed by users. It's ideal for organizing information in a space-efficient way while allowing users to focus on specific content.

#### Common use cases

* Frequently Asked Questions (FAQs)
* Product information that needs to be organized in categories
* Services or features explanation
* Terms and conditions or policies that need to be categorized

#### Usage tips

* Keep headings concise and descriptive to help users find relevant information
* Use icons to enhance visual appeal and improve content recognition
* Consider enabling the split layout for better readability on larger screens
* Limit content length within each accordion to maintain usability
* Use the "open" setting strategically to highlight the most important information
* Ensure mobile responsiveness by testing how content appears when collapsed and expanded

### Section settings

| Setting         | Description                                                                       |
| --------------- | --------------------------------------------------------------------------------- |
| Heading         | The main heading for the section                                                  |
| Content         | The descriptive text displayed below the heading                                  |
| Button label    | Text for the optional button                                                      |
| Button URL      | URL for the optional button                                                       |
| Top spacing     | Controls the spacing above the section (0-300px)                                  |
| Bottom spacing  | Controls the spacing below the section (0-300px)                                  |
| Color scheme    | Determines the background and text colors of the section                          |
| Border color    | Sets the color of the border (subtle or strong)                                   |
| Button color    | Sets the color and style of the button                                            |
| Title font      | Determines the font family used for the section title                             |
| Border position | Sets where borders appear (none, top, bottom, or both)                            |
| X alignment     | Controls horizontal alignment of content (left, center, or right)                 |
| Enable margin   | Toggles horizontal margin for the section                                         |
| Enable split    | Enables a split layout where heading is 1/3 and content is 2/3 width              |
| Visibility      | Controls on which devices the section is visible (all, mobile only, desktop only) |

### Block settings

#### Content

The Content block represents a single accordion item with a heading, collapsible content, and optional icon. It allows for individual styling of each accordion item.

Block limit: 50

| Setting            | Description                                                |
| ------------------ | ---------------------------------------------------------- |
| Heading            | The title displayed for this accordion item                |
| Content            | The content displayed when this accordion item is expanded |
| Icon               | Optional icon displayed before the heading                 |
| Color scheme       | Determines the color scheme of this accordion item         |
| Use open accordion | When enabled, this accordion item will be open by default  |
