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 title="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 title="shortcode" %}}

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

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

{{ partial "shortcodes/tab.html" (dict
  "context" .
  "title" "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 title="Code" %}}

printf("Hello World!");

{{% /tab %}}

Mixed content

{{% tab title="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 %}}