Tabs · Shortcodes

The paige-tabs shortcode displays content in tabs.

Basic

Code:

{{< paige-tabs >}}
{{< paige-tabs-buttons >}}
{{< paige-tabs-button >}}JSON{{< /paige-tabs-button >}}
{{< paige-tabs-button >}}TOML{{< /paige-tabs-button >}}
{{< paige-tabs-button >}}YAML{{< /paige-tabs-button >}}
{{< /paige-tabs-buttons >}}
{{< paige-tabs-panes >}}
{{< paige-tabs-pane >}}
{{< paige-code lang="json" >}}
{"foo": 123}
{{< /paige-code >}}
{{< /paige-tabs-pane >}}
{{< paige-tabs-pane >}}
{{< paige-code lang="toml" >}}
foo = 123
{{< /paige-code >}}
{{< /paige-tabs-pane >}}
{{< paige-tabs-pane >}}
{{< paige-code lang="yaml" >}}
foo: 123
{{< /paige-code >}}
{{< /paige-tabs-pane >}}
{{< /paige-tabs-panes >}}
{{< /paige-tabs >}}

Result:

{"foo": 123}

foo = 123

foo: 123