a post with tabs

This is how a post with tabs looks like. Note that the tabs could be used for different purposes, not only for code.

First tabs

To add tabs, use the following syntax:

{% tabs group-name %}

{% tab group-name tab-name-1 %}

Content 1

{% endtab %}

{% tab group-name tab-name-2 %}

Content 2

{% endtab %}

{% endtabs %}

With this you can generate visualizations like:

• php
• js
• ruby

<ul class="tab-content" id="5cecaedc-3a9c-4715-9a8c-e8bf90c7f963">

    <li class="active">

var_dump('hello');

</li>

    <li>

console.log("hello");

</li>

    <li>

pputs 'hello'

</li>

</ul>

Another example

• yaml
• json

<ul class="tab-content" id="fef15d90-911b-4e08-8ef0-ad7e0681f2b9">

    <li class="active">

hello:
  - "whatsup"
  - "hi"

</li>

    <li>

{
  "hello": ["whatsup", "hi"]
}

</li>

</ul>

Tabs for something else

• text
• quote
• list

<ul class="tab-content" id="a3c8caac-a267-4236-9446-4aaf63d91f44">

    <li class="active">

Regular text

</li>

    <li>

A quote

</li>

    <li>

Hipster list

• brunch
• fixie
• raybans
• messenger bag

</li>

</ul>