Skip to main content

Accordion

Plugin alias: accordion

editor42.init({
plugins: 'accordion'
});

Provides collapsible accordion sections in the editor content using HTML <details>/<summary> elements. Users can insert new accordions, toggle their open/closed state, and remove them. The plugin manages keyboard behavior (Enter in summary toggles instead of creating a newline), content normalization, and browser-specific quirks.

Commands​

CommandDescription
InsertAccordionInserts a new accordion at the current cursor position. Uses selected text as the summary if any, otherwise defaults to placeholder text.
ToggleAccordionToggles the open/closed state of the accordion at the current selection. Accepts an optional boolean value to force a specific state.
ToggleAllAccordionsToggles all accordions in the editor body. Accepts an optional boolean to force all open or all closed.
RemoveAccordionRemoves the accordion surrounding the current selection.

Toolbar buttons​

NameTypeDescription
accordionButtonInsert accordion
accordiontoggleToggle buttonToggle accordion open/closed
accordionremoveToggle buttonDelete accordion

A context toolbar with accordiontoggle and accordionremove appears automatically when the cursor is inside a <details> element.

NameDescription
accordionInsert accordion

Events​

EventDescription
ToggledAccordionFired after a single accordion is toggled. Payload: { element, state }
ToggledAllAccordionsFired after all accordions are toggled. Payload: { elements, state }