---
title: Tabs
slug: docs/de/7s_qXl_c4tvap3zC3_9Gs
description: Erfahren Sie, wie Sie den "Tabs"‑Block in Archbee effektiv nutzen, um Inhalte zu organisieren, die Lesbarkeit zu verbessern und die Navigation mit anpassbaren, anklickbaren Tabs zu erleichtern.
createdAt: 2024-07-24T11:17:19.316Z
---

![](https://api.archbee.com/api/optimize/K_JWZranXy1tD6qvlG2v6-qlzuX6ak9nYvTvfqGAc1q-20240822-125616.png)

Tabs ist ein Block, mit dem Sie Inhalte in mehrere Abschnitte innerhalb eines einzigen Dokuments organisieren können. Es ist wie ein Satz von Tabs, auf die Sie klicken können, um verschiedene Informationen anzuzeigen. Betrachten Sie es als eine Möglichkeit, mehrere Seiten innerhalb einer Seite zu erstellen.

## Warum Sie es verwenden sollten

- **Komplexe Inhalte organisieren**
- Gruppieren Sie zusammengehörige Inhalte in separate Tabs für eine bessere Struktur und Lesbarkeit.
- **Lesbarkeit verbessern**
- Machen Sie Ihre Inhalte leichter navigierbar und verständlicher.
- **Platz sparen**
- Nutzen Sie den Platz effizient, indem Sie Inhalte nacheinander anzeigen, statt alles auf einmal.
- **Interaktive Erlebnisse erstellen**
  Binden Sie Benutzer ein, indem Sie ihnen ermöglichen, aktiv die Informationen auszuwählen, die sie sehen möchten.

## Wie Sie den Tabs-Block verwenden

::::::WorkflowBlock
:::WorkflowBlockItem
Geben Sie `/` ein, um das Archbee Block-Menü zu öffnen
:::

:::WorkflowBlockItem
Suchen Sie nach dem **Registerkarten** Block und klicken Sie, um ihn einzufügen

![](https://api.archbee.com/api/optimize/K_JWZranXy1tD6qvlG2v6-eXhqk7Cgjios95U2j8it8-20240822-124946.png)
:::

:::WorkflowBlockItem
Passen Sie Ihre Tabs und Namen an.

Standardmäßig wird der Block mit 2 Tabs mit den Namen "Tab Name" und "Second Tab Name" erstellt.

Um einen Tab umzubenennen, müssen Sie den Bearbeitungsmodus für Labels öffnen durch:

- Doppelklicken auf das Tab-Label
- Oder Klicken auf das "Edit label" Icon ( :FontAwesome[]{icon="fa-solid fa-pen-to-square"} )

Drücken Sie auf Speichern ( :FontAwesome[]{icon="fa-solid fa-check"} ), um das Label zu aktualisieren, oder klicken Sie auf Verwerfen ( **↩** ), um Änderungen rückgängig zu machen.
:::

:::::WorkflowBlockItem
Fügen Sie gerne Ihren Inhalt hinzu. Sie können den Inhalt nach Belieben gestalten mit dem [WYSIWYG Menu](#) oder sogar andere Blöcke einfügen, wie zum Beispiel:

::::LinkArray{contentSource="CUSTOM"}
:::LinkArrayItem
Grundlegende Blöcke

- [Überschriften](docId\:KxU0tkuer8cfwWPLRrlpV)&#x20;
- [Erweiterbare Überschriften](docId\:BOkvJRwVCzFkQdzYgRVMi)&#x20;
- [Listen](docId\:bw9guZCpRJIeT8Jz1RTy1)&#x20;
- [Tabelle](docId\:YImTRk3JV-sIxpXtCjLXx)&#x20;
- [Schaltfläche](docId\:vD_AS4-awXv8abuhPPH6U)&#x20;
- [Hinweis](docId\:hCfLA_aIEo_Xeo1u8xQT5)&#x20;
- [Horizontaler Trenner](docId\:hOmRbr1lBt4LWMc5-ZmX2)&#x20;
- [Vertikale Teilung](docId\:HfEpUF-iowQU3k_H3nD8A)&#x20;
- [Minitaskers](docId\:qL4jwHcZjyJ3jnlU8_g1O)&#x20;
- [Linkraster](docId\:est5Bkk-FA7xngDKFu4i2)&#x20;
- [Workflow](docId\:k4PDPZ_n6XEOQLKItvXwq)&#x20;
:::

:::LinkArrayItem
Medienblöcke

- [Datei](docId\:ZZXZpE1mWwgaCGPbr5rcC)&#x20;
- [Image](docId\:DMALxhZZ_dTYx-ophz5ah)&#x20;
- [Video](docId\:Vs6ynBxofG39F-KodHKHJ)&#x20;
- [Karte](docId:_yOfaw0aBV3wReaiBqjrN)&#x20;
:::

:::LinkArrayItem
Entwicklerblöcke

- [Code-Editor: Mehrsprachig](docId\:eRPkctjSIIMtacUQCbtyF)&#x20;
- [Mermaid-Diagramme](docId\:lWzqcPc0R7ypCj5yRF1wW)&#x20;
- [TeX-Gleichung](docId\:CrNsd9gimPWGf6AAk8v4q)&#x20;
- [API-Endpunkte](docId\:Bg8VvTyXk7uVCjDAopOWS)&#x20;
- [OpenAPI/Swagger](docId:-_rSDwQKvfoJgpnSGPPMg)
- [Changelog](docId:0rGxak3VYBvD660Ymmbz7)&#x20;
:::
::::

Außerdem funktionieren die meisten unserer Integrationen innerhalb eines Tab-Blocks. Sie können Einbettungen aus anderen Tools wie Loom, Figma, Miro, Lucidcharts und mehr hinzufügen.

Sehen Sie sich die [Eingebettete Blöcke.](docId\:T9-RkDWXqNWjlOQXRVALp) Seite für weitere Informationen an.
:::::
::::::

## Markdown

So erstellen Sie einen Tab in Ihrem Dokument mit Markdown-Code:

:::::WorkflowBlock
:::WorkflowBlockItem
Beginnen Sie mit der Zeile `:::tabs`.
:::

::::WorkflowBlockItem
Jeder Tab-Inhalt steht zwischen den Markierungen `:::tab` und `:::`.

:::hint{type="warning"}
**🚨   Achtung!**

Ein Doppelpunkt `:` sollte in einem übergeordneten Markdown-Element stehen, um anzuzeigen, dass es ein anderes Markdown-Element einschließt.
:::
::::

In diesem Fall wird `:::tabs` zu `::::tabs` geändert.

Geben Sie jedem Tab einen Titel mit geschweiften Klammern wie `{title="Ihr Abschnittsname"}`. Dies ist der Name, der im Tab-Header angezeigt wird.
:::::

:::WorkflowBlockItem
Platzieren Sie den gewünschten Inhalt dieses Tabs zwischen diesen Zeilen. Siehe oben die erlaubten Blöcke, die innerhalb des Tab-Blocks verwendet werden können. Überprüfen Sie die Seite [Markdown-Verknüpfungen verwenden](docId\:YQDXdtOR4KrgqM-gRSm9e) , um zu sehen, wie andere Blöcke mit Markdown verwendet werden.
:::

:::WorkflowBlockItem
Erstellen Sie so viele Tabs, wie Sie möchten, und schließen Sie Ihren Tab-Block. Vergessen Sie nicht, für jede verschachtelte Ebene Spalten hinzuzufügen.

Unten ist ein Beispiel eines Tab-Blocks mit Markdown.
:::

```markdown
## Tabs

:::::tabs
::::tab{title="Tab 1"}
Some content for Tab 1

:::hint{style="info"}
Pull requests are very welcome! Please see CONTRIBUTING.md for more information.
Tthis is really nice
:::

- [x] This is a checkbox list
- [x] This is a checkbox list
- [ ] This is done
- [ ] This is a checkbox list
::::

:::tab{title="Tab Photos"}
![](https://placehold.co/600x400)

We would love you to contributeaaa
:::
:::::
```

Hier ist das Ergebnis:

:::::Tabs
::::Tab{title="Tab 1"}
Einige Inhalte für Tab 1

:::hint{type="info" attributes="{&#x22;style&#x22;:&#x22;info&#x22;}"}
Pull Requests sind sehr willkommen! Weitere Informationen finden Sie in CONTRIBUTING.md.
Das ist wirklich schön
:::

- [x] Dies ist eine Checkbox-Liste
- [x] Dies ist eine Checkbox-Liste
- [ ] Dies ist erledigt
  - [ ] Dies ist eine Checkbox-Liste
::::

:::Tab{title="Tab Photos"}
::Image[]{src="https://placehold.co/600x400" size="50" isUploading="false" darkWidth="600" darkHeight="400" width="600" height="400" showCaption="false"}

Wir würden uns freuen, wenn Sie beitragenaaa
:::
:::::

Alternativ können Sie diese Variante von Markdown verwenden, um einen Tabs-Block zu erzeugen.

```markdown
{% tabs %}
{% tab title="tab 2" %}some tab fasdfasdfasdfasdfads {% endtab %}
{% tab title="tab 2" %}some tab fasdfasdfasdfasdfads {% endtab %}
{% tab title="tab 2" %}some tab fasdfasdfasdfasdfads {% endtab %}
{% tab title="tab 2" %}some tab fasdfasdfasdfasdfads
{% endtab %}
{% endtabs %}
```

Überprüfen Sie die Seite [Markdown-Verknüpfungen verwenden](docId\:YQDXdtOR4KrgqM-gRSm9e) , um weitere Markdown-Verknüpfungen für andere Blöcke zu sehen.

## Beispiele

Siehe auf der Seite [Abschnitt „Vertical Split“, Beispielbereiche.](docId\:HfEpUF-iowQU3k_H3nD8A)&#x20;

***

::::LinkArray{contentSource="CUSTOM"}
:::LinkArrayItem{headerType="IMAGE" headerImage="https://api.archbee.com/api/optimize/K_JWZranXy1tD6qvlG2v6-C1IcmVcG0rx4ZLHX6X7V7-20250911-192557.png"}
:FontAwesome[]{icon="fa-solid fa-cubes"} &#x20;**&#x20;Andere Blöcke finden**

Entdecken Sie neue Wege und Blöcke, um beeindruckende und funktionale Dokumentationsseiten zu erstellen.

[Alle Blöcke ansehen](docId\:QR1fjhMprEujXqqNdqr1-)&#x20;
:::

:::LinkArrayItem{headerType="IMAGE" headerImage="https://api.archbee.com/api/optimize/K_JWZranXy1tD6qvlG2v6-YRyGGWKsNS1ZZJa5XJy0z-20250911-192608.png"}
:FontAwesome[]{icon="fa-solid fa-headset"}**&#x20; Brauchen Sie Hilfe?  ⬇️**

Verwenden Sie die **blaue** **Chat-Blase&#x20;**&#x69;n der unteren rechten Ecke.

Oder versuchen Sie **KI-Chat** (aus dem Suchfeld) für schnelle Antworten.
:::

:::LinkArrayItem{headerType="IMAGE" headerImage="https://api.archbee.com/api/optimize/K_JWZranXy1tD6qvlG2v6-MS_ubDHlXgoktt4svD2rL-20250911-192619.png"}
:FontAwesome[]{icon="fa-solid fa-hand-holding-heart"}**&#x20;  Ihre Meinung ist wichtig**

Verwenden Sie das folgende Feedback-Formular anonym.

Oder stellen Sie eine Frage im **Q\&A-Bereich** und unser Team oder die KI wird Ihnen eine Lösung bieten.
:::
::::

