Drupal is a registered trademark of Dries Buytaert
drupal 11.3.7 — Update released for Drupal core (11.3.7)! drupal 11.2.11 — Update released for Drupal core (11.2.11)! drupal 10.6.7 — Update released for Drupal core (10.6.7)! drupal 10.5.9 — Update released for Drupal core (10.5.9)! cms 2.1.1 — Update released for Drupal core (2.1.1)! drupal 11.3.6 — Update released for Drupal core (11.3.6)! drupal 10.6.6 — Update released for Drupal core (10.6.6)! cms 2.1.0 — Update released for Drupal core (2.1.0)! bootstrap 8.x-3.40 — Minor update available for theme bootstrap (8.x-3.40). menu_link_attributes 8.x-1.7 — Minor update available for module menu_link_attributes (8.x-1.7). eca 3.1.1 — Minor update available for module eca (3.1.1). layout_paragraphs 2.1.3 — Minor update available for module layout_paragraphs (2.1.3). ai 1.3.3 — Minor update available for module ai (1.3.3). ai 1.2.14 — Minor update available for module ai (1.2.14). node_revision_delete 2.0.3 — Minor update available for module node_revision_delete (2.0.3). moderated_content_bulk_publish 2.0.52 — Minor update available for module moderated_content_bulk_publish (2.0.52). klaro 3.0.10 — Minor update available for module klaro (3.0.10). klaro 3.0.9 — Minor update available for module klaro (3.0.9). layout_paragraphs 2.1.2 — Minor update available for module layout_paragraphs (2.1.2). geofield_map 11.1.8 — Minor update available for module geofield_map (11.1.8).
← All modules

ckeditor5_bootstrap_accordion

276 sites Security covered
View on drupal.org

Insert and edit a Bootstrap 5 accordion in CKEditor 5, seamlessly within the editor. CKEditor 5 Bootstrap Accordion is built using CKEditor 5's modern TypeScript plugin APIs and designed to look like it belongs in the editor.

Features

Core features

  • Add an accordion and insert or delete accordion items conveniently from the CKEditor toolbars.
  • Choose to open the first item or all items individually for each accordion.
  • Accordions work right out of the box, no extra CSS or JavaScript is required on your site if it already uses Bootstrap 5's provided CSS and JavaScript.
  • Accordion-in-accordion nesting is supported.

Features for developers

  • Build a custom CKEditor 5 plugin to add your own items to an accordion's toolbar, simply by altering the bootstrapAccordion.toolbarItems configuration.
  • Customize accordion styling by overriding Bootstrap 5's CSS variables, and style accordions to match your site's theme while keeping their functionality intact.

Accessibility

This project aims to be the most accessible accordion plugin available for Drupal / CKEditor 5.

  • aria-controls and aria-expanded attributes are added to all accordions and supported by Bootstrap.
  • Tab key navigation is possible while editing within an accordion widget.

Post-Installation

After installation, enable the plugin by dragging the "Accordion" item onto the toolbar of your text format (/admin/config/content/formats) and checking the box next to the "Accordion enabler" filter. Accordions won't function properly without the filter enabled.

Additional Requirements

Your site should be using the Bootstrap 5 frontend library in its main theme. The library isn't required in the admin theme or for editing the accordion.

This plugin was developed exclusively for modern Drupal 10+ sites and requires CKEditor 5, meaning it's entirely incompatible with CKEditor 4 or other editors. It's also incompatible with older versions of Bootstrap as it uses the new accordion component added to Bootstrap 5.

Related Projects

Interested in adding an advanced icon picker to CKEditor 5? Check out my sister project, CKEditor 5 Icons.

Activity

Total releases
2
First release
Dec 2025
Latest release
3 months ago
Release cadence
0 days
Stability
100% stable

Releases

Version Type Release date
1.0.2 Stable Dec 26, 2025
1.0.1 Stable Dec 26, 2025