There are three different tabsets available for displaying page content. Examples of each will follow below along with the different style ticks that can be applied to change the rendering style of the tabs themselves.
Due to the high number of variations that can be applied via style ticks and component rendering options, use one of the examples below for best results. Not all combinations will be supported and the display may not render correctly if an unsupported combination is used.
- Bootstrap Tabs (basic)
- Bootstrap Tabs Icons (includes images that display along with the title text)
- Bootstrap Tabs Fluid (same as Bootstrap Tabs Icons but the tab row extends the full width of the page to allow for a background color to be added)
All three renderings are compatible with each other and use the same datasource content. The tabset itself includes these fields:
- Heading (tab title)
- HeadingIcon (optional image that displays on the tab)
- Content (placeholder to add components, i.e. image, rich text, etc.)
There are two additional style ticks that are available to alter the appearance of the tabs.
- Tabs Top Blocks
- Tabs on Bottom