hugo-theme-relearn/exampleSite/content/shortcodes/tab.en.md

+++ description = "Show content in a single tab" title = "Tab" +++

You can use a tab shortcode to display a single tab.

This is especially useful if you want to flag your code example with an explicit language.

If you want multiple tabs grouped together you can wrap your tabs into the [tabs shortcode]({{% relref "shortcodes/tabs" %}}).

{{% tab name="c" %}}

printf("Hello World!");

{{% /tab %}}

Usage

While the examples are using shortcodes with named parameter you are free to also call this shortcode from your own partials.

{{< tabs groupid="shortcode-parameter">}} {{% tab name="shortcode" %}}

{{%/* tab name="c" */%}}
```c
printf("Hello World!");
```
{{%/* /tab */%}}

{{% /tab %}} {{% tab name="partial" %}}

{{ partial "shortcodes/tab.html" (dict
  "context" .
  "name" "c"
  "content" ("```c\nprintf(\"Hello World!\")\n```" | .RenderString)
)}}

{{% /tab %}} {{< /tabs >}}

Parameter

Name	Default	Notes
name	<empty>	Arbitrary text for the name of the tab.
<content>	<empty>	Arbitrary text to be displayed in the tab.

Examples

Code with collapsed margins

{{% tab name="Code" %}}

printf("Hello World!");

{{% /tab %}}

Mixed content

{{% tab name="Mixed" %}}

A tab can not only contain code but arbitrary text. In this case text and code will get a margin.

printf("Hello World!");

{{% /tab %}}