Docs

Button Group

Posted on December 29, 2023  (Last modified on June 7, 2025) • 1 min read • 116 words
Share via

Use the button-group shortcode to display a group of buttons.

Overview  

Use the button-group shortcode to display a group of buttons. Add inner <button> elements for each Button. As an example, the following shortcode displays a group of three buttons.

markdown
{{< button-group aria-label="Basic example" >}}
  {{< button color="primary" href="#!" >}}Left{{< /button >}}
  {{< button color="primary" href="#!" >}}Middle{{< /button >}}
  {{< button color="primary" href="#!" >}}Right{{< /button >}}
{{< /button-group >}}

Arguments  

The shortcode supports the following arguments:

Name Type Required Default Comment
aria-label string Alias for label.
label string Assistive label of the element.
Name Type Required Default
aria-label string
Alias for label.
label string
Assistive label of the element.

Examples  

See the Button Shortcode Documentation for additional styling options.