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

-     var_dump('hello');

-     console.log("hello");

-     pputs 'hello'

## Another example

- yaml
- json

-     hello:
        - "whatsup"
        - "hi"

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

## Tabs for something else

- text
- quote
- list

- Regular text

- > A quote

- Hipster list

  - brunch
  - fixie
  - raybans
  - messenger bag

## Enjoy Reading This Article?

Here are some more articles you might like to read next:

- Google Gemini updates: Flash 1.5, Gemma 2 and Project Astra
- Displaying External Posts on Your al-folio Blog
- a post with typograms
- a post that can be cited
- a post with pseudo code