Version: 8.3

Expansion panel layout element

Level: beginner

Expansion panel is a layout element to add page elements grouped by a single criterion. Learn more: Expansion panel, Set up an Expansion panel layout element (user documentation).

string id

The unique ID. Service field.

string title

The expansion panel title.

boolean expanded

Whether to expand the expansion panel content.

Available values

true	The expansion panel content is expanded.
false	The expansion panel content is collapsed.

string toggleType

The layout of the expander arrow. By default, "default."

Available values

default	Red expander arrow with a background.
material	Blue expander arrow without a background.

string togglePosition

The position of the expander arrow. By default, "before."

Available values

before	Display the arrow before the panel header.
after	Display the arrow after the panel header.

string ariaLabel

The text next to the expander arrow. By default, "title."

object extraStyles

Additional styles that set up the header and expander arrow.

string description

The description of the expansion panel header.

boolean fullWidthHeader

Whether to use the full width for the expansion panel header. By default, "false."

number titleWidth

The width of the expansion panel header in percentages. By default, "50."

string labelColor

The color of the expansion panel title.

See also​