# FAQ template

<figure><img src="https://content.gitbook.com/content/wp6wpeVynqvtz0WMVrUT/blobs/SGUdzQr03bxFzqne53hM/faq-section.png" alt=""><figcaption></figcaption></figure>

<figure><img src="https://content.gitbook.com/content/wp6wpeVynqvtz0WMVrUT/blobs/avABC65YMKkfNanOCwmG/faq-section-mobile.png" alt=""><figcaption></figcaption></figure>

With this section, you can add basic FAQ blocks to your store.

## **Adding a Section**

<figure><img src="https://content.gitbook.com/content/wp6wpeVynqvtz0WMVrUT/blobs/mAOQ7WkkYF7ALSyjOHLP/faq-settings.png" alt=""><figcaption></figcaption></figure>

The section is static on an **FAQ page** template, it was added initially and cannot be removed.

## **Section settings**

### General

<figure><img src="https://content.gitbook.com/content/wp6wpeVynqvtz0WMVrUT/blobs/RKOd0DmVOnaXZiL4jrFr/faq-settings-heading.png" alt=""><figcaption></figcaption></figure>

1. **`Heading`** - the setting allows you to set the text for the title. If the value is not specified, the name of the page to which the template is applied is displayed.

### Banner

<figure><img src="https://content.gitbook.com/content/wp6wpeVynqvtz0WMVrUT/blobs/KDquQMNxLXRMRdnCfZaU/faq-settings-banner.png" alt=""><figcaption></figcaption></figure>

1. **`Image`** - the setting allows you to set a picture for the banner;
2. **`Heading`** - the setting allows you to specify a heading for the banner;
3. **`Link`** - the setting allows you to specify a link for the banner.

### Layout

<figure><img src="https://content.gitbook.com/content/wp6wpeVynqvtz0WMVrUT/blobs/tZjv2A5U6QQa82S8UvO4/faq-settings-layout.png" alt=""><figcaption></figcaption></figure>

1. **`Desktop offset top`** - the **top** indent of the section on the **desktop**;
2. **`Desktop offset bottom`** - the **bottom** indent of the section on the **desktop**;
3. **`Mobile offset top`** - the **top** indent of the section on the **mobile**;
4. **`Mobile offset bottom`** - the **bottom** indent of the section on the **mobile**.

## **Blocks settings**

### **Block Question and answer**

<figure><img src="https://content.gitbook.com/content/wp6wpeVynqvtz0WMVrUT/blobs/JKkKrhaWfmTA7828mGNe/faq-block-settings-2.png" alt=""><figcaption></figcaption></figure>

The block is responsible for displaying the *question-answer* pair. When rendering, it is displayed as an accordion.

1. **`Heading`** - accordion title, question;
2. **`Text`** - response, accordion content;
3. **`Icon`** - icon in the accordion header.

### **Block Category**

<figure><img src="https://content.gitbook.com/content/wp6wpeVynqvtz0WMVrUT/blobs/MmKFyIF1MS0B33eI9CLM/faq-block-settings.png" alt=""><figcaption></figcaption></figure>

The block is designed to group question-answer pairs by category. Rendered as a header separating a group of accordions. In addition, adding blocks of this type makes it possible to build section navigation in the form of a side menu (**desktop**), and a fixed category bar (**mobile**). Clicking on a menu item scrolls to the corresponding category.

1. **`Heading`** - title, category name.

## **Additional information**

1. The **Question and answer** block is not displayed if the settings for the `Heading` and `Text` fields are not specified;
2. The **Category** block is not displayed if the settings for the `Heading` field are not specified;
3. The **Banner** is not displayed if the settings for the `Image` field are not specified.
