SR Tabs Accordion 01
SR Tabs Accordion 01 is great for FAQs.
Module Overview - SR Tabs Accordion 01
This module is a combination of headers, subheaders, cards, and texts
An ideal use case for SR Tabs Accordion 01 is for frequently asked questions and answers about your products or services.
Module Settings Walkthrough
You can edit the following items within the Styles tab:
- Layout: page or full-width
- Container width: minimum, narrow, wide, maximum
- Top-bottom padding: default, no padding, small padding, large padding, custom padding
- Background option: image, video, color, custom, gradient
- Text align: right, left, center, justified
- Text color: auto, primary, secondary, tertiary, white, black, dark, light, success, info, warning, danger, custom
- Border styles: none, solid, dotted, dashed, double
- Responsive settings:
- Tablet: text-align at breakpoint (same text-align options); top-bottom padding at breakpoint (same padding options)
- Mobile: text-align at breakpoint (same text-align options); top-bottom padding at breakpoint (same padding options)
For SR Tabs Accordion 01, most settings are focused on the header(s), description and cards
Setting custom classes and ID
At the very top of the content section, you have the ability to add custom classes and an ID to the module.
Header and Content
The first setting you see when editing SR Tabs Accordion 01 is the header.
You can have as many headers as you want. You can even choose which Size they are: H1, H2, H3, H4, H5, H6, P.
You can also choose the Display Size to L, XL, XXL, XXXL
You also have an option to create a sub-header or description
Editing the Accordion Items
- You can have as many Accordion Items as you want.
- Each card comes with an Accordion Label and Accordion Content.
- You also have the option to have the accordion expanded by default.
Extra module behavioural settings
The SR Tabs Accordion 01 module has extra settings that affect the behaviour of the module. These settings are:
- One column: You have the ability to have the accordion items, and the headings occupy just one column.
- Sticky: You have the option to have the headings of the module stick when scrolling.
- Close Inactive Accordions: You have the option to only show active accordions.
- Accordions to show: You have the ability to set the number of accordions to show on load.
How to Use SR Tabs Accordion 01- See it Live
- Sprocket Rocket Module page: You can see the module live.
- AdoptMatch's FAQ Page: Here is a nice example of how they want their FAQ page to look like. The visitor can choose which questions they want to see the answers on!