Anmelden

AI-Blöcke für WordPress mit WP Suite AI-Kit

AI‑Kit stellt UI primär über den AI‑Kit Feature Gutenberg Block (Pro) bereit.

Wenn Sie dieselbe Funktion außerhalb des Blockeditors benötigen (Classic Editor, Elementor, Theme Templates), siehe Shortcode.

Der siteweite Chatbot wird im Admin UI konfiguriert, siehe Chatbot.

AI‑Kit Feature Block (Pro)​

Der AI‑Kit Feature Block rendert eine konfigurierbare UI, mit der Besucher One-shot KI-Aktionen ausführen können:

  • Write
  • Rewrite
  • Proofread
  • Summarize
  • Translate

Intern verwendet der Block dieselben Laufzeit-APIs, die in der JavaScript-API dokumentiert sind.

Pro feature

Der Feature-Block gehört zum Pro Frontend. Ist Pro nicht aktiv, erscheint der Block im Frontend möglicherweise nicht.

Konfigurations-Referenz​

Die Gutenberg Inspector UI zeigt nicht jede Option in jedem Build, aber die Konzepte entsprechen denselben Basiseigenschaften wie Shortcode und JS API.

Grundverhalten​

  • mode — Was die UI tut: write | rewrite | proofread | summarize | translate.
  • variation — Layout: default (inline/panel) oder modal.
  • title — optionaler Titel im Panel/Modal-Header.
  • autoRun — wenn true, sofort beim Öffnen starten (typisch bei „Summarize this page“).
  • editable — wenn true, können Besucher Ergebnis nach dem Rendern bearbeiten (Live Preview), bevor onAccept ausgelöst wird.
  • acceptButtonTitle — custom Label für den „Apply/Insert/Accept“-Button (wenn onAccept gesetzt ist).
  • onDeviceTimeout — Timeout für On-Device-Optionen überschreiben (5s Translate, 45s andere Modi). Wirksam nur wenn AI auf Device aktiv ist (API Settings ≠ „Backend only“).

Default-Input und Optionen​

Sie können ein default-Payload setzen:

  • default.text — Starttext,
  • default.instructions — zusätzliche Anweisungen,
  • default.outputLanguage — Sprachcode oder auto,
  • default.tone — Stil für writer/rewriter,
  • default.length — Länge für writer/rewriter/summarizer,
  • default.type — summarizer type,
  • default.outputFormat — plain-text | markdown | html.

Besucher-Overrides​

allowOverride steuert, was Besucher in der UI ändern darf:

  • allowOverride.text
  • allowOverride.instructions
  • allowOverride.tone
  • allowOverride.length
  • allowOverride.type
  • allowOverride.outputLanguage

Layout & Selektoren​

  • optionsDisplay — Darstellung von Optionen-Accordion,
  • inputSelector — CSS Selektor für Eingabetext auf Seite,
  • outputSelector — Zielausgabe für Resultat (falls passend).

Sprache und Richtung​

  • language — UI Sprache für Labels (unabhängig von default.outputLanguage).
  • direction — ltr | rtl | auto.

Theme & Erscheinung​

Diese Optionen mapen zu Mantine Theme Optionen:

  • colorMode — light | dark | auto.
  • primaryColor — Mantine Farbschlüssel oder Custom Key.
  • primaryShade — Zahl (0–9) oder { light, dark }.
  • colors — optional eigene Farben.
  • themeOverrides — CSS-String, der ins Component Theme gemischt wird.

Für CSS-basierte Anpassungen (Launcher/Chat/Spacing etc.) siehe Theming (CSS variables).

Open button (Modal-Variante)​

Bei variation="modal" können auch diese Felder gesetzt werden:

  • openButtonTitle — Beschriftung des Buttons,
  • openButtonIcon — Base64 Data URL (z. B. data:image/svg+xml;base64,...).
  • showOpenButtonTitle / showOpenButtonIcon — Titel/Icon unabhängig anzeigen.
  • showRegenerateOnBackendButton — zweiten Regenerate-Button im Modal-Footer umschalten.

AI‑Kit Doc Search Block (Pro)​

Der AI‑Kit Doc Search Block rendert eine leichte Suche, die Ihre Knowledge Base abfragt und liefert:

  • eine kurze Antwort/Zusammenfassung,
  • optionale Source Cards (Dokument + Auszug).

Ideal für „Hilfezentrum“, Produktdoku, interne Portale oder alle Fälle, in denen Besucher eigene Dokumente durchsuchen sollen statt eines vollständigen Chatbots.

Pro feature

Doc Search gehört zur Pro Frontend-Fläche. Ist Pro nicht aktiv, erscheint der Block im Frontend möglicherweise nicht.

Doc Search verwendet intern dieselben Laufzeit-APIs, die in der JavaScript-API dokumentiert sind, insbesondere sendSearchMessage() und renderSearchComponent().

Doc Search Konfiguration​

Grundverhalten​

  • variation — Layout der UI,
  • autoRun — wenn true, unmittelbar starten (hilfreich wenn Query bereits vorliegt,
  • title — optionale Überschrift über dem Suchfeld.

Eingabequelle​

  • inputSelector — CSS Selektor für bestehendes Input-/Textarea-Element. Ist dieser gesetzt, wird die Query daraus statt aus dem eigenen Feld gelesen.

Suchbutton​

  • searchButtonIcon — Base64 Datenurl des Icons (SVG/PNG).
  • showSearchButtonTitle / showSearchButtonIcon — Titel/Icon separat ein/ausblenden.

Ergebnisse​

  • topK — max Ergebnisse (Default: 10).
  • snippetMaxChars — max Zeichen im Snippet (Default: 160).
  • aiDisclosure — optionaler Hinweistext zu KI-Einschränkungen, standardmäßig je Sprache vorgegeben. Leerlassen nutzt Standardtext.

Sprache, Richtung, Theme​

  • language — UI Sprache (system, en, de, hu, …).
  • direction — ltr | rtl | auto.
  • colorMode — light | dark | auto.
  • primaryColor — primärer Color-Key.
  • themeOverrides — CSS-String für das Component Theme.