---
title: "Academy App"
canonical_url: "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten"
locale: de
meta:
  "og:title": "Academy App"
---

[Zur Startseite](https://academy.laioutr.com/)

- [Essentials-Apps](https://academy.laioutr.com/bereiche/essentials-apps)

- [Essentials-Apps](https://academy.laioutr.com/leitfaeden/essentials-apps-grundlagen)

- [Widerrufsbutton mit der Essentials-App Legal einrichten](https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten)

# Widerrufsbutton mit der Essentials-App Legal einrichten

Die Essentials-App Legal liefert Bausteine für rechtlich geforderte Inhalte, allen voran den Widerrufsbutton nach EU-Richtlinie 2023/2673 mit zweistufigem Ablauf und automatischer Eingangsbestätigung. Platzierung, Texte und Datenquellen werden in Studio eingerichtet.

## Bevor du startest

<dl>

<dt>Tarif</dt>
<dd>Jede Plattform-Lizenz</dd>

<dt>Rolle</dt>
<dd>Admin für die Installation, Editor für Studio</dd>

<dt>Dauer</dt>
<dd>8 Min.</dd></dl>

### Voraussetzungen

- Essentials-App Mailer eingerichtet
- Commerce- oder Abo-App verbunden
- Rechtlich geprüfte Texte

Zuletzt geprüft am 15. Oktober 2026

Liefert Bausteine für rechtlich geforderte Inhalte, darunter den Widerrufsbutton nach EU-Richtlinie 2023/2673 mit dauerhafter Platzierung, eindeutiger Beschriftung, zweistufigem Ablauf, Eingangsbestätigung per Mailer und Protokoll jedes Widerrufs.

[Entwicklerdokumentation](https://docs.laioutr.com/apps/essentials/legal)

## So funktioniert es

1. Legal installierenWo: Cockpit, Apps · Rolle: Admin · Dauer: 2 min
2. Mailer für Eingangsbestätigungen prüfenWo: Cockpit, Apps · Rolle: Admin · Dauer: 5 min
3. Button in Header oder Footer platzierenWo: Studio · Rolle: Editor · Dauer: 10 min
4. Vertragsquelle und Texte einrichtenWo: Studio · Rolle: Editor mit Developer · Dauer: 20 min
5. Testwiderruf durchführen und veröffentlichenWo: Studio und Live-Seite · Rolle: Editor · Dauer: 10 min

## Häufige Fehler

<dl>

<dt>Nach dem Widerruf kommt keine Eingangsbestätigung an.</dt>
<dd>**Ursache:** Die Essentials-App Mailer ist nicht installiert oder die Zugangsdaten sind falsch.</dd>
<dd>**Lösung:** Mailer einrichten, eine Testmail senden und den Widerruf erneut testen.</dd>

<dt>Im ersten Schritt erscheinen keine Verträge.</dt>
<dd>**Ursache:** Die Vertragsquelle ist nicht mit der Commerce- oder Abo-App verbunden.</dd>
<dd>**Lösung:** In Studio die Datenquelle für Bestellungen, Abos oder digitale Käufe festlegen und die App-Verbindung prüfen.</dd>

<dt>Der Button fehlt auf einzelnen Seiten.</dt>
<dd>**Ursache:** Der Button steckt in einer seitenbezogenen Section statt im globalen Header oder Footer, oder die Änderung ist nicht veröffentlicht.</dd>
<dd>**Lösung:** Button in eine globale Section verschieben und mit Publish veröffentlichen.</dd></dl>

Die Essentials-App **Legal** liefert Bausteine für rechtlich geforderte Inhalte eines Laioutr-Projekts. Der zentrale Baustein ist der Widerrufsbutton. Inhalt und Struktur werden in Studio an Rechtsraum, Markenton und juristische Prüfung angepasst.

### Widerrufsbutton

Seit dem 19. Juni 2026 verlangt die EU-Richtlinie 2023/2673, dass Verbraucher Fernabsatzverträge so einfach widerrufen können, wie sie sie geschlossen haben. Das betrifft Onlineshops, Anbieter digitaler Produkte, Abo-Plattformen und Vermittler von Finanzdienstleistungen, unabhängig von der Unternehmensgröße. Die App liefert dafür:

- einen dauerhaft erreichbaren Button für Header, Footer oder Hauptnavigation
- eindeutige Beschriftung wie „Vertrag widerrufen“ statt „Stornieren“, mit Übersetzungen
- den zweistufigen Ablauf: Vertrag auswählen, dann Widerruf bestätigen
- eine automatische Eingangsbestätigung per E-Mail über den Mailer
- ein Protokoll jedes Widerrufs mit Zeitstempel und Vertragsreferenz

Die rechtliche Prüfung der Texte bleibt beim Betreiber des Shops.

## Schritt für Schritt

1. 1 ### Schritt 1: App installieren

   Im Cockpit **Apps** öffnen, die Essentials-App **Legal** suchen und **Install** wählen.
2. 2 ### Schritt 2: Mailer prüfen

   Sicherstellen, dass die Essentials-App **Mailer** eingerichtet ist. Ohne Mailer verschickt Legal keine Eingangsbestätigung.
3. 3 ### Schritt 3: Button platzieren

   In Studio den Widerrufsbutton in Header, Footer oder Hauptnavigation einsetzen. Eine globale Section sorgt dafür, dass er auf allen Seiten erscheint.
4. 4 ### Schritt 4: Vertragsquelle verbinden

   Für den ersten Schritt festlegen, welche Verträge zur Auswahl stehen: Bestellungen, Abos oder digitale Käufe aus der verbundenen Commerce- oder Abo-App.
5. 5 ### Schritt 5: Texte prüfen

   Beschriftung und Texte beider Schritte je Sprache prüfen und juristisch freigeben lassen. Missverständliche Begriffe wie „Stornieren“ vermeiden.
6. 6 ### Schritt 6: Veröffentlichen

   In Studio mit **Save** speichern und mit **Publish** veröffentlichen.

## Ergebnis prüfen

Auf der Live-Seite den Widerrufsbutton von mehreren Seiten aus öffnen, einen Testvertrag durch beide Schritte führen und prüfen, ob die Eingangsbestätigung im Postfach ankommt und der Widerruf mit Zeitstempel und Vertragsreferenz protokolliert ist.

## Häufige Fragen

Wer muss einen Widerrufsbutton anbieten?

Praktisch alle Unternehmen mit Fernabsatzverträgen: Onlineshops, Anbieter digitaler Produkte, Abo-Plattformen und Vermittler von Finanzdienstleistungen, unabhängig von der Größe.

Wie lange muss der Button sichtbar sein?

Während der gesamten Widerrufsfrist. Deshalb gehört er in Header, Footer oder Hauptnavigation und nicht auf eine einzelne Seite.

Lässt sich der Ablauf an das eigene Design anpassen?

Ja. Der zweistufige Ablauf besteht aus Laioutr-Sections und Blocks und lässt sich in Studio gestalten, ohne die geforderten Schritte zu verlieren.

Ersetzt die App eine rechtliche Beratung?

Nein. Die App liefert die technische Umsetzung. Texte und Einsatz prüft der Betreiber mit der eigenen Rechtsberatung.

## Passend dazu

- [Essentials-Apps: Kernfunktionen von Laioutr nach Bedarf installieren](https://academy.laioutr.com/artikel/essentials-apps-kernfunktionen-nach-bedarf)4 Min.

  Essentials-Apps sind Apps, die Laioutr selbst bereitstellt und die Kernfunktionen wie SEO, E-Mail-Versand oder rechtliche Bausteine mitbringen. Ein Projekt installiert sie im Cockpit nach Bedarf, statt diese Funktionen fest im Frontend zu verankern.
- [Apps finden, installieren und konfigurieren](https://academy.laioutr.com/artikel/apps-finden-installieren-und-konfigurieren)6 Min.

  Apps stehen im Cockpit unter Apps als Katalog bereit, werden je Umgebung installiert und unter Configuration eingerichtet. Die Storefront nutzt sie ab dem nächsten Deployment.
- [Studio im Überblick](https://academy.laioutr.com/artikel/studio-im-ueberblick)5 Min.

  Studio ist der visuelle Editor im Cockpit: Dort baut das Team Seiten aus Sections und Blocks, sieht jede Änderung in einer Live-Vorschau der echten Storefront und veröffentlicht, wenn alles passt.
- [E-Mails versenden mit der Essentials-App Mailer](https://academy.laioutr.com/apps/e-mails-versenden-essentials-mailer)10 Min.

  Die Essentials-App Mailer versendet transaktionale E-Mails eines Laioutr-Projekts, etwa Kontaktanfragen, Bestellbestätigungen oder die Eingangsbestätigung der App Legal. Versendet wird über ein SMTP-Konto oder über Dienste wie SendGrid, Amazon SES oder Mailgun.

## In einer Lektion lernen

- [Pflichtseiten und die Essentials-App Legal](https://academy.laioutr.com/lektionen/live-gang-pflichtseiten-legal)6 Min.

## [Essentials-Apps](https://academy.laioutr.com/leitfaeden/essentials-apps-grundlagen)

In diesem Leitfaden suchen

1. [Essentials-Apps: Kernfunktionen von Laioutr nach Bedarf installieren](https://academy.laioutr.com/artikel/essentials-apps-kernfunktionen-nach-bedarf)4 Min.
2. [Widerrufsbutton mit der Essentials-App Legal einrichten](https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten)8 Min.
3. [E-Mails versenden mit der Essentials-App Mailer](https://academy.laioutr.com/apps/e-mails-versenden-essentials-mailer)10 Min.

## Structured Data

```json
{
  "@context": "https://schema.org",
  "@graph": [
    {
      "@id": "https://academy.laioutr.com/#website",
      "@type": "WebSite",
      "inLanguage": "de",
      "name": "Default",
      "url": "https://academy.laioutr.com/",
      "workTranslation": {
        "@id": "https://academy.laioutr.com/#website"
      }
    },
    {
      "@id": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten#webpage",
      "name": "Academy App",
      "url": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten",
      "@type": [
        "WebPage",
        "FAQPage"
      ],
      "breadcrumb": {
        "@id": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten#breadcrumb"
      },
      "isPartOf": {
        "@id": "https://academy.laioutr.com/#website"
      },
      "mainEntity": [
        {
          "@id": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten#/schema/question/1"
        },
        {
          "@id": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten#/schema/question/2"
        },
        {
          "@id": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten#/schema/question/3"
        },
        {
          "@id": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten#/schema/question/4"
        }
      ],
      "potentialAction": [
        {
          "@type": "ReadAction",
          "target": [
            "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten"
          ]
        }
      ]
    },
    {
      "@id": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten#breadcrumb",
      "@type": "BreadcrumbList",
      "itemListElement": [
        {
          "@type": "ListItem",
          "name": "Home",
          "item": "https://academy.laioutr.com/",
          "position": 1
        },
        {
          "@type": "ListItem",
          "name": "Essentials-Apps",
          "item": "https://academy.laioutr.com/bereiche/essentials-apps",
          "position": 2
        },
        {
          "@type": "ListItem",
          "name": "Essentials-Apps",
          "item": "https://academy.laioutr.com/leitfaeden/essentials-apps-grundlagen",
          "position": 3
        },
        {
          "@type": "ListItem",
          "name": "Widerrufsbutton mit der Essentials-App Legal einrichten",
          "item": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten",
          "position": 4
        }
      ]
    },
    {
      "@id": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten#/schema/question/1",
      "@type": "Question",
      "inLanguage": "de",
      "name": "Wer muss einen Widerrufsbutton anbieten?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>Praktisch alle Unternehmen mit Fernabsatzverträgen: Onlineshops, Anbieter digitaler Produkte, Abo-Plattformen und Vermittler von Finanzdienstleistungen, unabhängig von der Größe.</p>"
      }
    },
    {
      "@id": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten#/schema/question/2",
      "@type": "Question",
      "inLanguage": "de",
      "name": "Wie lange muss der Button sichtbar sein?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>Während der gesamten Widerrufsfrist. Deshalb gehört er in Header, Footer oder Hauptnavigation und nicht auf eine einzelne Seite.</p>"
      }
    },
    {
      "@id": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten#/schema/question/3",
      "@type": "Question",
      "inLanguage": "de",
      "name": "Lässt sich der Ablauf an das eigene Design anpassen?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>Ja. Der zweistufige Ablauf besteht aus Laioutr-Sections und Blocks und lässt sich in Studio gestalten, ohne die geforderten Schritte zu verlieren.</p>"
      }
    },
    {
      "@id": "https://academy.laioutr.com/apps/widerrufsbutton-mit-der-essentials-app-legal-einrichten#/schema/question/4",
      "@type": "Question",
      "inLanguage": "de",
      "name": "Ersetzt die App eine rechtliche Beratung?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>Nein. Die App liefert die technische Umsetzung. Texte und Einsatz prüft der Betreiber mit der eigenen Rechtsberatung.</p>"
      }
    }
  ]
}
```