Collapse
Use the collapse shortcode to reveil or hide a panel.
Use the collapse shortcode to reveil or hide a panel. The panel can contain both HTML code and plain text. Link a button to the panel by assigning it’s ID to the collapse attribute. As an example, the following shortcode displays a button that, when clicked, triggers a panel to appear or disappear.
{{< button collapse="collapse-1" >}}
Trigger panel
{{< /button >}}
{{< collapse id="collapse-1" class="p-3 border rounded" >}}
Some placeholder content for the collapse component. This panel is *hidden by default* but
revealed when the user activates the relevant trigger.
{{< /collapse >}}id field fails when embedding (multiple) collapse shortcodes in an example. Provide an explicit, unique id to prevent cross-interference.The shortcode supports the following arguments:
| Argument | Required | Description |
|---|---|---|
| id | Yes | Required unique id of the collapse element, e.g. “collapse-1”. |
| class | No | Optional class attribute of the inner panel element, e.g. “p-3”. |
The nav shortcode uses multiple collapse panels under the hood to provide access to a group of tab panes.