Module Description
This module provides a field type called "Horizontal Tabs" which consists of tab label and tab body elements. The number of allowed tabs can be set when adding the field to an entity. Tab labels can be set to display as either traditional tabs or as pill buttons.
This module depends on the Bootstrap framework. It does not prescribe how Bootstrap should be integrated with the site, but presumes that it is integrated and that the tab JavaScript utility is loaded on all pages.
This implementation is compliant with WAI-ARIA guidelines for tab accessibility.
Options/Features Display settings for the field formatter (i.e., "Manage Display") include:
* Tab style: "Tabs" (default) or "Pills"
* Tab orientation: "Horizontal" (default) or "Vertical"
Compatibility
* Bootstrap 3, 4 or 5
The simplest way to integrate the required Bootstrap components is to use or sub-theme the Bootstrap Drupal theme (whose current stable version uses Bootstrap version 3).
If using with Bootstrap 4, you will need to include the `util.js` and `tab.js` components. See https://getbootstrap.com/docs/4.0/components/navs/#javascript-behavior.
Installation & configuration
* After enabling this module, go an entity's "Manage fields" page and click "Add field."
* A new field type, "Horizontal Tabs," will be available.
* Follow standard Drupal field steps for adding the field.
* Under the "Manage Display" page, choose whether the tab headers should display as standard "Tabs" or "Pill buttons". See examples at https://getbootstrap.com/docs/4.0/components/navs/#javascript-behavior
This module depends on the Bootstrap framework. It does not prescribe how Bootstrap should be integrated with the site, but presumes that it is integrated and that the tab JavaScript utility is loaded on all pages.
This implementation is compliant with WAI-ARIA guidelines for tab accessibility.
Options/Features Display settings for the field formatter (i.e., "Manage Display") include:
* Tab style: "Tabs" (default) or "Pills"
* Tab orientation: "Horizontal" (default) or "Vertical"
Compatibility
* Bootstrap 3, 4 or 5
The simplest way to integrate the required Bootstrap components is to use or sub-theme the Bootstrap Drupal theme (whose current stable version uses Bootstrap version 3).
If using with Bootstrap 4, you will need to include the `util.js` and `tab.js` components. See https://getbootstrap.com/docs/4.0/components/navs/#javascript-behavior.
Installation & configuration
* After enabling this module, go an entity's "Manage fields" page and click "Add field."
* A new field type, "Horizontal Tabs," will be available.
* Follow standard Drupal field steps for adding the field.
* Under the "Manage Display" page, choose whether the tab headers should display as standard "Tabs" or "Pill buttons". See examples at https://getbootstrap.com/docs/4.0/components/navs/#javascript-behavior
Module Link
Project Usage
532
Security Covered
Covered By Security Advisory
Version Available
Production
Module Summary
This module aims to provide a field type called 'Horizontal Tabs' with tab label and tab body elements, allowing for customization of tab style and orientation while ensuring compliance with WAI-ARIA guidelines for tab accessibility.
Data Name
bootstrap_horizontal_tabs
OPENAI CHATBOT
OPENAI CHATBOT
