# FAQ section

Source: https://themes.spicydesign.ca/help/reference/sections/faq/
Updated: 2026-11-12

Animated accordion with numbering and FAQPage structured data. Settings for the FAQ section in the Picante Shopify theme.


Animated accordion with numbering and FAQPage structured data.

The same section in the three themes:

![The FAQ section in the Picante style.](https://themes.spicydesign.ca/help/shots/section-faq--picante.webp)

![The FAQ section in the Overdrive style.](https://themes.spicydesign.ca/help/shots/section-faq--overdrive.webp)

![The FAQ section in the Pastille style.](https://themes.spicydesign.ca/help/shots/section-faq--pastille.webp)

**Where to find it:** In the theme editor, choose **Add section** on any template, then pick **FAQ**.

The heading area is a static block named **Section header**. Select it in the section sidebar to edit the eyebrow, heading, text and buttons, or to restyle or reorder them.

When you add this section, it starts from the **FAQ** preset.

## Settings

### Layout

| Setting | Type | Default | Options | Notes |
| --- | --- | --- | --- | --- |
| Layout | Select | Split with sticky heading | Split with sticky heading, Stacked | Split keeps the heading in view beside the questions on desktop. |
| Alignment | Select | Center | Left, Center, Right | Shown when **Layout** is Stacked. |
| Style | Select | Divider lines | Divider lines, Cards |  |
| Show question numbers | Checkbox | On |  |  |
| Open one answer at a time | Checkbox | On |  |  |
| Add FAQ structured data | Checkbox | Off |  | Off by default. Turn it on once the questions and answers here are your own, on one FAQ section per page. Leave it off for questions repeated on many pages. |

### Section style

| Setting | Type | Default | Options | Notes |
| --- | --- | --- | --- | --- |
| Color scheme | Color scheme | Scheme 1 |  |  |
| Layout width | Select | Page width | Page width, Full width |  |
| Animation on scroll | Select | Theme default | Theme default, None, Fade, Slide up, Scale in, Wipe, Blur in |  |
| Top padding | Slider | 80 px | 0 to 200 px, step 8 |  |
| Bottom padding | Slider | 80 px | 0 to 200 px, step 8 |  |

## Blocks

Add, reorder, duplicate or remove these blocks in the section sidebar: **Section header**, **Question**.

This section holds up to 40 blocks.

### Section header block settings

| Setting | Type | Default | Options | Notes |
| --- | --- | --- | --- | --- |
| Layout | Select | Stacked | Stacked, Split: content left, button right |  |
| Alignment | Select | Left | Left, Center, Right | Shown when **Layout** is Stacked. |
| Max width | Select | None | None, Narrow, Normal |  |
| Gap | Slider | 12 px | 0 to 64 px, step 4 |  |
| Space below | Slider | 48 px | 0 to 120 px, step 4 |  |
| Animation on scroll | Select | None | Theme default, None, Fade, Slide up, Scale in, Wipe, Blur in |  |


### Question block settings

| Setting | Type | Default | Options | Notes |
| --- | --- | --- | --- | --- |
| Question | Text | How long does shipping take? |  |  |
| Answer | Rich text | Share your typical processing and delivery times here. |  |  |
| Open by default | Checkbox | Off |  |  |

#### Typography

| Setting | Type | Default | Options | Notes |
| --- | --- | --- | --- | --- |
| Text style | Select | Heading 5 | Intro text, Heading 6, Heading 5, Heading 4, Heading 3 |  |
| Text color | Select | Color scheme text | Color scheme text, Accent, Custom |  |
| Custom text color | Color |  |  | Shown when **Text color** is Custom. |

#### Colors and border

| Setting | Type | Default | Options | Notes |
| --- | --- | --- | --- | --- |
| Inherit color scheme | Checkbox | On |  |  |
| Color scheme | Color scheme | Scheme 1 |  | Shown when **Inherit color scheme** is off. |
| Corner radius | Slider | 0 px | 0 to 80 px, step 2 |  |
| Border | Select | None | None, Solid, Dashed |  |
| Border thickness | Slider | 2 px | 1 to 8 px, step 1 | Shown when **Border** is not None. |

#### Padding

| Setting | Type | Default | Options | Notes |
| --- | --- | --- | --- | --- |
| Customize padding | Checkbox | Off |  | Padding settings stay visible while any side has padding. Set a side to 0px to remove its padding. |
| Top padding | Slider | 0 px | 0 to 100 px, step 2 | Shown when **Customize padding** is on or **Top padding** is on or **Bottom padding** is on or **Left padding** is on or **Right padding** is on. |
| Bottom padding | Slider | 0 px | 0 to 100 px, step 2 | Shown when **Customize padding** is on or **Top padding** is on or **Bottom padding** is on or **Left padding** is on or **Right padding** is on. |
| Left padding | Slider | 0 px | 0 to 100 px, step 2 | Shown when **Customize padding** is on or **Top padding** is on or **Bottom padding** is on or **Left padding** is on or **Right padding** is on. |
| Right padding | Slider | 0 px | 0 to 100 px, step 2 | Shown when **Customize padding** is on or **Top padding** is on or **Bottom padding** is on or **Left padding** is on or **Right padding** is on. |

#### Motion

| Setting | Type | Default | Options | Notes |
| --- | --- | --- | --- | --- |
| Animation on scroll | Select | Theme default | Theme default, None, Fade, Slide up, Scale in, Wipe, Blur in |  |