> ## Documentation Index
> Fetch the complete documentation index at: https://docs.osiro.app/llms.txt
> Use this file to discover all available pages before exploring further.

# Interactive Steps

> Einen Ablauf in nummerierten Schritten erklären, die sich beim Scrollen animiert hervorheben.

## Überblick

Interactive Steps erklärt wie der [Steps](/convert/landing-page-editor/steps)-Block einen Ablauf in nummerierten Schritten – zeigt die Schritte aber untereinander entlang einer vertikalen Linie an. Beim Scrollen wandert die farbige Markierung über diese Linie und hebt so Schritt für Schritt den jeweils aktiven Punkt hervor.

<img src="https://mintcdn.com/osiro/CSCkwQAyOWdXFNQl/images/convert/landing-page-editor/blocks/interactive_steps/interactive_steps.png?fit=max&auto=format&n=CSCkwQAyOWdXFNQl&q=85&s=a74beb6bdf35636c39f9a47c748890b1" width="2940" height="1846" data-path="images/convert/landing-page-editor/blocks/interactive_steps/interactive_steps.png" />

<Tip>Einsatz, wenn Sie ein Problem, einen Status quo oder eine Entwicklung Schritt für Schritt erzählen und den Besucher aktiv durchs Scrollen mitnehmen möchten.</Tip>

***

## Komponenten

### Text

Eyebrow, Titel, Untertitel.

<img src="https://mintcdn.com/osiro/Z4XO7wLiiUyOachM/images/convert/landing-page-editor/blocks/interactive_steps/is-text.png?fit=max&auto=format&n=Z4XO7wLiiUyOachM&q=85&s=5133a2e6da0bf487e2ecc5b07e1b79d8" width="3323" height="2160" data-path="images/convert/landing-page-editor/blocks/interactive_steps/is-text.png" />

### Schritte

Die einzelnen Punkte entlang der Linie mit [Icon](/convert/landing-page-editor/icons), Titel und Beschreibung; weitere Schritte über "Option hinzufügen".

<img src="https://mintcdn.com/osiro/Z4XO7wLiiUyOachM/images/convert/landing-page-editor/blocks/interactive_steps/is-steps.png?fit=max&auto=format&n=Z4XO7wLiiUyOachM&q=85&s=b63403e30a0b6bbaf8e1c0f981e9d244" width="3323" height="2160" data-path="images/convert/landing-page-editor/blocks/interactive_steps/is-steps.png" />

### Button 1–3

Bis zu drei [Buttons](/convert/landing-page-editor/button) mit konfigurierbarem [Symbol](/convert/landing-page-editor/icons).

<img src="https://mintcdn.com/osiro/Z4XO7wLiiUyOachM/images/convert/landing-page-editor/blocks/interactive_steps/is-buttons.png?fit=max&auto=format&n=Z4XO7wLiiUyOachM&q=85&s=64318f5e155ab3ed4157ac8cc1115602" width="3323" height="2160" data-path="images/convert/landing-page-editor/blocks/interactive_steps/is-buttons.png" />