Installationsanleitung

Die Installation von AI Anywhere auf Ihrer Website ist einfach. Sie können Ihren Helfer auf zwei Arten verwenden: die Helfer-Seite (kein Code: teilbarer Link, Nutzung von jedem Browser) oder den Helfer-Button auf Ihrer Website einbetten. Diese Anleitung behandelt den Einbettungsweg.

Zwei Möglichkeiten, Ihren Helfer zu nutzen

• Hilfeseite (kein Code): Holen Sie sich einen teilbaren Link von Ihrem Dashboard. Kein Code, keine Integration, kein Snippet. Öffnen Sie ihn in jedem Browser oder teilen Sie ihn mit anderen; verwenden Sie ihn von jedem Gerät aus ohne Bereitstellung.
• Hilfeknopf (einbetten): Fügen Sie das Skript zu Ihrem <head> und den Helfer-Anker neben Ihrem Textbereich hinzu. Der Helfer-Button erscheint auf Ihrer Website neben dem Feld.

You can also set a Helper to "Both": it will be available as a shareable Helper Page link and embeddable on your site. For embed (or Both), you must create or select a Site (and its group) in the dashboard; the snippet uses that site's ID. The default Helper Page site cannot be used for embedding.

Sites und Einbettung

To embed a Helper on your website, you need a Site in your dashboard (Sites → Add site, or select an existing one). Each new site gets a default group. Use that site's ID in the script tag. If you only use the Helper Page (shareable link), you do not need to create a separate site.

Voraussetzungen

Bevor Sie beginnen, stellen Sie sicher, dass Sie Folgendes haben:

• Ein aktives AI Anywhere-Konto: Registrieren Sie sich bei ai-anywhere.ai wenn Sie noch nicht\
• Ein erstellter Helfer: Erstellen Sie in Ihrem Dashboard einen neuen Helfer. Konfigurieren Sie den Selektor und die Helfer-Antwort.

Wie der Helfer funktioniert

Das Helfer-Widget folgt einem einfachen Drei-Schritte-Prozess:

1. Liest: Wenn ein Benutzer auf die Helfer-Schaltfläche klickt, liest es den aktuellen Text im zugehörigen Textbereich oder Eingabefeld.
2. Vergleicht: Der Text wird mit Ihrer konfigurierten Helfer-Antwort und den Schlüsselwörtern verglichen, um Verbesserungsbereiche zu identifizieren.
3. Schlägt vor: Der Helfer bietet kontextbezogene Vorschläge, um Benutzern zu helfen, besseren und vollständigeren Inhalt zu schreiben, der zu Ihrer Helfer-Antwort passt.

Einbetten des Helfer-Skripts

Um AI Anywhere zu Ihrer Webseite hinzuzufügen, müssen Sie:

1. Laden Sie das Helfer-Skript in Ihrem <head> Abschnitt
2. Fügen Sie den Helfer-Anker-Span neben Ihrem Textbereich oder Formularfeld hinzu

Schritt 1: Laden Sie das Skript

Fügen Sie das Skript-Tag zu Ihrem HTML\ <head> In Ihre Website einfügen

<script src="https://ai-anywhere.ai/sdk/v1/loader.js" data-site="your-site-id"></script>

Schritt 2: Initialisieren Sie den Helfer

Fügen Sie den Helfer-Anker-Span neben Ihrem Textbereich oder Formularfeld hinzu, wo der Helfer erscheinen soll:

<span data-helper-anchor data-helper-token="your-helper-token"></span>

Vollständiges Beispiel

Hier ist ein vollständiges Beispiel, das beide Teile zeigt:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>für Contact Form 7)</title>
  
  <!-- Einbetten des Helfer-Skripts -->
  <script src="https://ai-anywhere.ai/sdk/v1/loader.js" data-site="your-site-id"></script>
</head>
<body>
  <form>
    <textarea id="message" placeholder="Ihre Nachricht:"></textarea>
    <span data-helper-anchor data-helper-token="your-helper-token"></span>
  </form>
</body>
</html>

Verständnis der Konfiguration

Lassen Sie uns jede Konfigurationsoption aufschlüsseln:

• data-site: Ein Abfrageparameter, der Ihr Konto identifiziert und auf allen Seiten Ihrer Website geteilt wird
• data-helper-anchor: CSS-Selektor, wo der Helfer erscheinen soll
• data-helper-token: Einzigartiger Schlüssel, der diese spezifische Helfer-Konfiguration identifiziert. Jede Helfer-Instanz benötigt ihren eigenen einzigartigen Schlüssel. Im Dashboard zu finden, wenn Sie einen Helfer erstellen.

Visuelles Beispiel

Das sehen die Nutzer, wenn der Helfer aktiv ist:

Testen und Verifizieren

Nachdem Sie Ihr Snippet zu Ihrer Seite hinzugefügt haben, folgen Sie diesen Schritten, um zu überprüfen, ob alles funktioniert:

1. Aktualisieren Sie Ihre Seite: Speichern Sie Ihre HTML-Datei und aktualisieren Sie Ihren Browser (Hard-Refresh mit Strg+Shift+R oder Cmd+Shift+R, um den Cache zu leeren).
2. Suchen Sie nach der Helfer-Schaltfläche: Sie sollten die Helfer-Schaltfläche neben jedem <textarea> oder <input type="text"> Element auf Ihrer Seite sehen.
3. Testen Sie den Helfer: Geben Sie etwas Text in Ihr Formularfeld ein und klicken Sie dann auf die Helfer-Schaltfläche. Der Helfer sollte Ihren Text analysieren und Vorschläge machen.
4. Überprüfen Sie die Konsole: Überprüfen Sie die Browser-Konsole (F12), um sicherzustellen, dass keine Fehler vorliegen

Häufige Probleme & Fehlerbehebung

Häufig gestellte Fragen

Funktioniert es überall?

AI Anywhere funktioniert mit standardmäßigen HTML-Formularelementen, einschließlich:

• <textarea> Elemente
• <input type="text"> Felder
• <input type="email"> Felder
• Contenteditable-Divs (mit zusätzlicher Konfiguration)

Es funktioniert auf jeder Website, unabhängig vom Framework (React, Vue, Angular, reines HTML, WordPress, etc.), solange Sie das Skript-Tag hinzufügen können <head> Abschnitt hinzu.

Kann ich den Button ausblenden?

Ja, Sie können den Helfer-Button bei Bedarf mit CSS ausblenden:

However, hiding the button means users won't be able to access the Helper. Consider making it visible only on specific pages or for specific user roles instead.

Kann ich mehrere Helfer auf einer Seite verwenden?

Ja! Sie können mehrere Helfer-Instanzen auf einer einzigen Seite haben, jede mit unterschiedlichen Konfigurationen. Fügen Sie einfach mehrere Anker-Spans mit unterschiedlichen Helfer-Tokens hinzu:

<!-- Erster Helfer für das Nachrichtenfeld -->
<textarea id="message"></textarea>
<span data-helper-anchor data-helper-token="message-helper-token"></span>

<!-- Zweiter Helfer für das Notizenfeld -->
<textarea id="notes"></textarea>
<span data-helper-anchor data-helper-token="notes-helper-token"></span>

Jeder Helfer wird sich unabhängig an seinem angegebenen Ort anheften.