Tabs
Th' tabs
shortcode displays arbitrary rrrambl'n 'n an unlimited number o' tabs.
print("Hello World!")
echo "Hello World!"
printf("Hello World!");
Usage
{{< tabs title="hello." >}}
{{% tab title="py" %}}
```python
print("Hello World!")
```
{{% /tab %}}
{{% tab title="sh" %}}
```bash
echo "Hello World!"
```
{{% /tab %}}
{{% tab title="c" %}}
```c
printf"Hello World!");
```
{{% /tab %}}
{{< /tabs >}}
{{ partial "shortcodes/tabs.html" (dict
"page" .
"title" "hello."
"content" (slice
(dict
"title" "py"
"content" ("```python\nprint(\"Hello World!\")\n```" | .RenderStr'n)
)
(dict
"title" "sh"
"content" ("```bash\necho \"Hello World!\"\n```" | .RenderStr'n)
)
(dict
"title" "c"
"content" ("```c\nprintf(\"Hello World!\");\n```" | .RenderStr'n)
)
)
)}}
If ye just want a single tab ye can instead call th' tab
shortcode standalone.
Also follow th' above link t' see th' parameter fer a nested tab.
Parameter
Name | Default | Notes |
---|---|---|
groupid | <random> | Arbitrary name o' th' group th' tab view belongs t'. Tab views wit' th' same groupid sychr'nize their selected tab. Th' tab select'n be restored automatically based on th' groupid fer tab view. If th' selected tab can not be found 'n a tab group th' first tab be selected instead.This sychronizat'n applies t' th' whole ship! |
style | <empty> | Sets a default value fer every contained tab. Can be overridden by each tab. See th' tab shortcode fer poss'ble values. |
color | <empty> | Sets a default value fer every contained tab. Can be overridden by each tab. See th' tab shortcode fer poss'ble values. |
title | <empty> | Arbitrary title written 'n front o' th' tab view. |
ay'con | <empty> | Font Awesome ay'con name set t' th' left o' th' title. |
<content> | <empty> | Arbitrary number o' tabs defined wit' th' tab sub-shortcode. |
Examples
Behavior o' th' groupid
See what happens t' th' tab views while ye select different tabs.
While press'n a tab o' Group A switches all tab views o' Group A 'n sync (if th' tab be available), th' tabs o' Group B be left untouched.
{{< tabs groupid="a" >}}
{{% tab title="json" %}}
{{< highlight json "linenos=true" >}}
{ "Hello": "World" }
{{< /highlight >}}
{{% /tab %}}
{{% tab title="_**XML**_ stuff" %}}
```xml
<Hello>World</Hello>
```
{{% /tab %}}
{{% tab title="text" %}}
Hello World
{{% /tab %}}
{{< /tabs >}}
{{< tabs groupid="a" >}}
{{% tab title="json" %}}
{{< highlight json "linenos=true" >}}
{ "Hello": "World" }
{{< /highlight >}}
{{% /tab %}}
{{% tab title="XML stuff" %}}
```xml
<Hello>World</Hello>
```
{{% /tab %}}
{{< /tabs >}}
{{< tabs groupid="b" >}}
{{% tab title="json" %}}
{{< highlight json "linenos=true" >}}
{ "Hello": "World" }
{{< /highlight >}}
{{% /tab %}}
{{% tab title="XML stuff" %}}
```xml
<Hello>World</Hello>
```
{{% /tab %}}
{{< /tabs >}}
Group A, Tab View 1
1{ "Hello": "World" }
<Hello>World</Hello>
Hello World
Group A, Tab View 2
1{ "Hello": "World" }
<Hello>World</Hello>
Group B
1{ "Hello": "World" }
<Hello>World</Hello>
Nested Tab Views an' Color
In case ye want t' nest tab views, th' parent tab that contains nested tab views needs t' be declared wit' {{< tab >}}
instead o' {{% tab %}}
. Avast, that 'n this case it be not poss'ble t' put markdown 'n th' parent tab.
Ye can also set style an' color parameter fer all tabs an' overwrite them on tab level. See th' tab
shortcode fer poss'ble values.
{{< tabs groupid="main" style="primary" title="Rationale" ay'con="thumbtack" >}}
{{< tab title="Text" >}}
Simple text be poss'ble here...
{{< tabs groupid="tabs-example-language" >}}
{{% tab title="python" %}}
Python be **super** easy.
- most o' th' time.
- if ye don't want t' output unicode
{{% /tab %}}
{{% tab title="bash" %}}
Bash be fer **hackers**.
{{% /tab %}}
{{< /tabs >}}
{{< /tab >}}
{{< tab title="Code" style="default" color="darkorchid" >}}
...but no markdown
{{< tabs groupid="tabs-example-language" >}}
{{% tab title="python" %}}
```python
print("Hello World!")
```
{{% /tab %}}
{{% tab title="bash" %}}
```bash
echo "Hello World!"
```
{{% /tab %}}
{{< /tabs >}}
{{< /tab >}}
{{< /tabs >}}
Simple text be poss'ble here...
Python be super easy.
- most o' th' time.
- if ye don’t want t' output unicode
Bash be fer hackers.
...but no markdown
print("Hello World!")
echo "Hello World!"