The FAQ is a powerful element designed to help you build an organized and visually appealing FAQ section on your website. With this widget, you can easily customize each FAQ item to suit your needs by writing your own content or using pre-designed templates.
It offers flexible display options, allowing you to choose between Accordion, List, or Grid layouts to present your FAQs in an engaging way.
Additionally, you can enhance the user experience by adding visuals, making it easier for visitors to find the answers they need.
This widget not only improves navigation but also helps to reduce customer inquiries by providing clear and accessible information.
The “FAQ” element features the following controls.
Content
FAQs
- Icon: Select the icon to use in FAQ.
- Question: Enter the content for a question.
- Content Type: Select the type to display the answer.
- Answer: Enter the answer manually(applicable for Editor Content Type).
- Template: Select the template to display the answer(applicable for Template Content Type)
- Active as Default: Enable the option to make them active by default.

- Layout: Select layout from Grid, Accordion, or List.
These options are applicable to the Grid Layout.
- Columns: Specify the number of columns you want to display.
- Columns Gap(px): Specify the gap between columns.
- Row Gap(px): Specify the gap between rows.

- Enable First FAQ Default Open: Enable the option to display the first FAQ open by default(applicable for accordion layout).
- Question HTML Tag: Select the HTML tag for question.
- Enable Icon: Enable the option to display the icon.
- Icon: Choose the icon.
- Icon Position: Select the icon position.
- FAQ Schema: Enable the option to activate the FAQ schema.

These options are applicable to the Accordion Layout.
- Toggle: Enable the option to toggle the FAQ.
- Trigger Action: Select the trigger action from Hover or Click.
- Transition Speed: Set the transition speed.

Navigation
These options are applicable to the Accordion Layout.
- Enable Icon: Enable the option to display the navigation icon.
- Icon: Select the navigation icon.
- Active Icon: Select the navigation icon for the active state.
- Position: Select the position of navigation icon.

Item Style
- Width: Enter the width of item box.
- Background: Select the icon for item box.
- Border: Set the border for a box.
- Box Shadow: Set the box shadow.
- Padding: Set the padding.
- Margin: Set the margin.

Question Style
- Alignment: Choose the alignment of question.
- Typography: Set the typography.
- Blend Mode: Select the blend mode.

Closed/Opened
- Color: Choose the text color of question.
- Background: Select the background of question box.
- Border: Set the border for a box.

- Box Shadow: Set the box shadow.
- Padding: Set the padding.
- Margin: Set the margin.

Icon
- Size: Specify the size of icon.
- Color: Select the color of icon.
- Background: Select the background color of icon.
- Border: Set the border.

- Spacing: Set the spacing between icon & question content.
- Rotate: Set the rotation properties.
- Padding: Set the padding.

Answer Style
- Typography: Set the typography of answer content.
- Background: Select the background.
- Border: Set the border.
- Box Shadow: Set the box shadow.
- Padding: Set the padding.
- Margin: Set the margin.

Navigation Icon Style
These options are applicable to the Accordion layout.
Normal
- Color: Select the color of navigation icon when the FAQ is in normal state.
- Background: Choose the background color of navigation.
- Border: Set the border.

Opened
- Color: Select the color of navigation icon when the FAQ is in opened state.
- Background: Choose the background color of navigation.
- Border: Set the border.

- Size: Specify the size of navigation icon.
- Rotate: Set the rotate properties of an icon.
- Spacing: Specify the spacing between the navigation icon and other content.
- Padding: Set the padding.

Check out the Demo page of FAQ element.