Einbindung

Die eine Zeile

Die Zeile gehört in die Seitenvorlage, die alle Seiten Ihrer Website verwenden, in den <head> oder vor </body>:

<script src="https://leichtesprache.participaite.de/plugin/leichte-sprache.js" data-site="IHRE-KENNUNG" defer></script>

Ohne weitere Angaben findet das Plugin den Inhaltsbereich selbst und zeigt unten rechts einen schwebenden Button, der über feste Leisten am unteren Fensterrand wie Cookie-Hinweise nach oben ausweicht. defer hält den Aufbau der Seite nicht auf. Alles Weitere stellen Sie mit data-*-Attributen ein (Konfiguration), den fertigen Einbau prüfen Sie mit der Prüfliste.

Bis Oktober 2026 hieß die Adresse https://leichtesprache.yavio.ai/plugin/leichte-sprache.js. Ältere Einbindungen funktionieren damit weiter, Sie müssen nichts ändern. Bei der nächsten Änderung an der Seitenvorlage können Sie auf die neue Adresse umstellen.

Freischaltung

Das Plugin übersetzt nur auf freigeschalteten Websites. Wir vergeben eine Kennung (den Wert für data-site) und hinterlegen die Adressen Ihrer Seiten, etwa https://www.stadt.de/ und https://stadt.de/, sowie ein Stundenkontingent für neue Übersetzungen. Test- und Vorschau-Systeme mit eigener Adresse schalten wir mit frei, wenn Sie uns die Adressen an info@participaite.de schicken. Auf einer Adresse ohne Freischaltung erscheint der Button, meldet beim Einschalten aber „Leichte Sprache ist gerade nicht möglich.“

Erlaubt Ihr System nur eine Skript-Adresse ohne weitere Attribute, hängen Sie die Kennung an:

https://leichtesprache.participaite.de/plugin/leichte-sprache.js?site=IHRE-KENNUNG

Automatische Aktualisierung oder feste Version

Skript-Adresse	Verhalten
`https://leichtesprache.participaite.de/plugin/leichte-sprache.js`	Immer die aktuelle Version. Browser laden eine neue Version spätestens nach 5 Minuten.
`https://leichtesprache.participaite.de/plugin/v0.3.3/leichte-sprache.js`	Genau Version 0.3.3. Diese Datei ändert sich nie.

Wir empfehlen die Adresse ohne Versionsnummer. Muss bei Ihnen jede Änderung an eingebundenen Skripten freigegeben werden, binden Sie eine feste Version ein und ändern später die Nummer in der Adresse. Adressen mit Versionsnummer bleiben dauerhaft gültig. Verbesserungen am Übersetzungsmodell wirken auch bei einer festen Version.

Wo der Button erscheint

Schwebend (Standard)
Über dem Inhalt
Im eigenen Kopfbereich
Eigene Steuerung

Standard ist unten rechts. data-position wählt eine andere Stelle (bottom-left, middle-right, middle-left, top-right, top-left), data-offset den Abstand zum Fensterrand.

<script src="https://leichtesprache.participaite.de/plugin/leichte-sprache.js"
        data-site="IHRE-KENNUNG" data-position="bottom-left" data-offset="24,80" defer></script>

Der Button steht im Inhalt, meist unter der Hauptüberschrift, und verdeckt so keine schwebenden Buttons anderer Werkzeuge, etwa zum Vorlesen oder Chatten.

<script src="https://leichtesprache.participaite.de/plugin/leichte-sprache.js"
        data-site="IHRE-KENNUNG" data-placement="above" defer></script>

Der Button kommt als einfaches <button class="ls-toggle"> in ein leeres Element Ihrer Vorlage, etwa in die Service-Leiste, und Ihr CSS gestaltet ihn (Gestaltung). Fehlt das Element, erscheint der schwebende Button.

<span id="ls-button"></span>
<!-- … -->
<script src="https://leichtesprache.participaite.de/plugin/leichte-sprache.js"
        data-site="IHRE-KENNUNG" data-button="#ls-button" defer></script>

Kein Button. Sie schalten Leichte Sprache mit eigenen Bedienelementen über die JavaScript-API oder mit Direktlinks.

<script src="https://leichtesprache.participaite.de/plugin/leichte-sprache.js"
        data-site="IHRE-KENNUNG" data-placement="none" defer></script>

Einbau in das CMS

Die Zeile gehört in das Template bzw. Layout aller Seiten, nicht in einzelne Seiten. Geben Sie sie nur für nicht angemeldete Besucherinnen und Besucher aus, nicht im Seiten-Editor und nicht in der Vorschau, damit nie eine Übersetzung über die Seitenbearbeitung gespeichert wird. Viele Bearbeitungsmodi erkennt das Plugin zusätzlich selbst (Redaktionsmodus).

Im TypoScript-Setup der Seite. includeJSFooter nimmt nur eine Adresse, die Kennung steht deshalb in der Adresse:

page.includeJSFooter.leichteSprache = https://leichtesprache.participaite.de/plugin/leichte-sprache.js?site=IHRE-KENNUNG
page.includeJSFooter.leichteSprache.external = 1
page.includeJSFooter.leichteSprache.defer = 1

# nicht für angemeldete Redakteurinnen und Redakteure
[backend.user.isLoggedIn]
page.includeJSFooter.leichteSprache >
[END]

Mit weiteren data-*-Attributen geht es über headerData:

page.headerData.110 = TEXT
page.headerData.110.value = <script src="https://leichtesprache.participaite.de/plugin/leichte-sprache.js" data-site="IHRE-KENNUNG" data-placement="above" defer></script>

[backend.user.isLoggedIn]
page.headerData.110 >
[END]

Am einfachsten geht es mit unserem WordPress-Plugin, ohne Eingriff in das Theme:

leichte-sprache.zip herunterladen.
Im WordPress-Backend: Plugins → Installieren → Plugin hochladen → Datei auswählen → Jetzt installieren.
Plugin aktivieren. Der Button erscheint sofort unten rechts auf jeder Seite.

Mehr ist nicht nötig. Unter Einstellungen → Leichte Sprache können Sie den Button nach links oder unter die Hauptüberschrift setzen und eine Farbe wählen. Mit dem Shortcode [leichte_sprache] steht er an einer Stelle Ihrer Wahl, etwa im Kopfbereich (in Elementor mit dem Widget „Shortcode“). Unter „Erweitert“ legen Sie Inhaltsbereich, ausgenommene Bereiche und ausgenommene Seiten fest. Eine Kennung brauchen Sie nur, wenn wir Ihnen eine genannt haben.

Das Plugin lädt immer die aktuelle Version des Skripts, neue Funktionen kommen ohne Update des Plugins. Angemeldete Nutzerinnen und Nutzer sehen den Button auf der Website ebenfalls. In Bearbeitungsansichten lädt das Plugin nicht: WordPress-Backend, Customizer, Elementor, Divi, Beaver Builder, Bricks, Oxygen, WPBakery und Thrive Architect. WP Rocket, LiteSpeed Cache, Autoptimize, SiteGround Optimizer und Cloudflare Rocket Loader verzögern das Skript nicht.

Ohne Plugin geht es in der functions.php des (Child-)Themes:

add_action('wp_head', function () {
  if (is_user_logged_in()) return;   // nicht für angemeldete Nutzerinnen und Nutzer
  echo '<script src="https://leichtesprache.participaite.de/plugin/leichte-sprache.js" data-site="IHRE-KENNUNG" defer></script>';
});

Für Drupal 10 und 11 als Bibliothek des Themes (meintheme.libraries.yml):

leichte_sprache:
  js:
    https://leichtesprache.participaite.de/plugin/leichte-sprache.js?site=IHRE-KENNUNG: { type: external, attributes: { defer: true } }

Nur für nicht angemeldete Besucherinnen und Besucher einbinden (meintheme.theme):

function meintheme_page_attachments_alter(array &$attachments) {
  if (\Drupal::currentUser()->isAnonymous()) {
    $attachments['#attached']['library'][] = 'meintheme/leichte_sprache';
  }
}

Fügen Sie die Zeile in jede HTML-Seite vor </head> oder vor </body> ein, bei einem Seitengenerator wie Hugo, Jekyll oder Eleventy einmal in das Basis-Layout.

Redaktionsmodus

Das Plugin startet nicht, wenn es Zeichen eines Bearbeitungsmodus sieht (unser WordPress-Plugin schaltet diese Erkennung ab, weil es Bearbeitungsansichten selbst auslässt):

WordPress: Admin-Leiste oder angemeldete Nutzerin bzw. angemeldeter Nutzer (#wpadminbar, body.logged-in), Customizer-Vorschau
TYPO3: Admin-Panel, Vorschau-Hinweis und Frontend-Editing
Drupal: Toolbar oder angemeldete Nutzerin bzw. angemeldeter Nutzer (#toolbar-administration, body.user-logged-in)
Joomla und Neos: deren Bearbeitungsoberflächen
jedes System: bearbeitbare Bereiche mit Text (contenteditable) und der Bearbeitungsmodus des Browsers (designMode)

Die Konsole meldet dann [Leichte Sprache] CMS editing mode (…): plugin not started. Sind Sie im CMS angemeldet, testen Sie deshalb in einem privaten Browserfenster. Die Erkennung ist nur eine zusätzliche Sicherung neben den Regeln oben. data-admin-check="false" schaltet sie ab, das empfehlen wir nicht.

Die eine Zeile​

Freischaltung​

Automatische Aktualisierung oder feste Version​

Wo der Button erscheint​

Einbau in das CMS​

Redaktionsmodus​