So fügen Sie das ElevenLabs Conversational AI-Widget zu Ihrer Wix-Website hinzu

Möchten Sie Ihren Kundensupport und die Interaktion verbessern, indem Sie das Conversational AI von ElevenLabs zu Ihrer Wix-Website hinzufügen? Sie sind hier richtig. Diese Anleitung führt Sie Schritt für Schritt durch den gesamten Prozess und hilft Ihnen, häufige Fehler zu vermeiden.

Bevor Sie beginnen

Stellen Sie sicher, dass Sie Folgendes haben:

1. Wix Premium-Konto: Das Einbetten von benutzerdefiniertem JavaScript ist nur in Premium-Plänen verfügbar.
2. ElevenLabs-Konto: Sie benötigen ein ElevenLabs-Konto, um Conversational AI-Agenten zu erstellen. Hier anmelden.
3. Zugang zum Wix-Editor mit aktiviertem Dev-Modus: Sie benötigen den Dev-Modus, um benutzerdefinierten Code zu Ihrer Website hinzuzufügen.

Schritt-für-Schritt-Anleitung

Schritt 1: Bereiten Sie Ihr ElevenLabs-Widget vor

1. Melden Sie sich in Ihrem ElevenLabs-Konto an.
2. Navigieren Sie zum Bereich Conversational AI.
3. Richten Sie Ihren Conversational Agent ein und kopieren Sie den bereitgestellten JavaScript-Einbettungscode.

Schritt 2: Aktivieren Sie den Dev-Modus in Wix

1. Öffnen Sie Ihre Wix-Website im Editor.
2. Klicken Sie im oberen Menü auf Dev-Modus, um erweiterte Funktionen wie das Hinzufügen von benutzerdefiniertem Code zu aktivieren.

Hinweis: Wenn der Dev-Modus nicht sichtbar ist, stellen Sie sicher, dass Sie den vollständigen Wix-Editor verwenden, nicht den Wix ADI (Artificial Design Intelligence).

Schritt 3: Fügen Sie den JavaScript-Einbettungscode hinzu

1. Gehen Sie im Wix-Editor zu Einstellungen > Benutzerdefinierter Code.
2. Klicken Sie auf + Benutzerdefinierten Code hinzufügen.
3. Fügen Sie den JavaScript-Code von ElevenLabs in das bereitgestellte Feld ein.
4. Wählen Sie unter Code anwenden auf Alle Seiten (oder wählen Sie eine bestimmte Seite für das Widget).
5. Speichern und veröffentlichen Sie Ihre Änderungen.

Häufige Probleme und Fehlerbehebung

Haben Sie ein Problem beim Hinzufügen eines Conversational AI-Widgets zu Ihrer Wix-Website? Befolgen Sie diese einfachen Schritte, um Ihr Problem zu lösen.

Problem 1: Widget trennt die Verbindung oder lädt nicht

• Ursache: Falsche Allowlist-Konfiguration oder Verwendung eines kostenlosen Wix-Plans.
• Lösung: Stellen Sie sicher, dass Ihre Website-URL entweder aus der Allowlist entfernt oder im ElevenLabs-Dashboard korrekt konfiguriert ist.

Problem 2: JavaScript funktioniert nicht

• Ursache: JavaScript-Code nicht richtig hinzugefügt.
• Lösung: Überprüfen Sie, ob das JavaScript im richtigen Feld unter Benutzerdefinierter Code eingefügt wurde.

Problem 3: Kostenloser Wix-Plan

• Ursache: Das Einbetten von benutzerdefiniertem JavaScript wird in kostenlosen Wix-Plänen nicht unterstützt.
• Lösung: Upgrade auf einen Wix Premium-Plan.

Erweiterte Tipps

Wenn Sie die bestmögliche Erfahrung für die Besucher Ihrer Website schaffen möchten, beachten Sie diese erweiterten Best Practices.

Anpassen der Allowlist

Wenn Ihr Widget nach dem Einbetten des Codes immer noch nicht funktioniert, befolgen Sie diese Schritte:

1. Melden Sie sich in Ihrem ElevenLabs-Konto an.
2. Gehen Sie zu den Allowlist-Einstellungen für Ihren Conversational AI-Agenten.
3. Stellen Sie sicher, dass die Domain Ihrer Website korrekt hinzugefügt wurde. Wenn Probleme weiterhin bestehen, versuchen Sie, Ihre Domain aus der Allowlist zu entfernen und erneut zu testen.

Testen auf einer Live-Domain

Das Widget funktioniert möglicherweise nicht richtig im Vorschau-Modus von Wix. Veröffentlichen Sie Ihre Website und testen Sie sie auf der Live-Domain, um sicherzustellen, dass sie wie erwartet funktioniert.

Cross-Browser-Kompatibilitätstests

Sobald Ihr Widget live ist, testen Sie es in mehreren Browsern wie Chrome, Firefox, Edge und Safari. Einige Funktionen können sich in verschiedenen Browsern unterschiedlich verhalten, da JavaScript unterschiedlich gehandhabt wird.

1. Öffnen Sie Ihre Website in jedem Browser.
2. Interagieren Sie mit dem Widget und überprüfen Sie seine Reaktionsfähigkeit.
3. Achten Sie auf Probleme wie fehlerhafte Formatierungen oder Funktionsfehler. Wenn Probleme auftreten, überprüfen Sie Ihren JavaScript-Code oder kontaktieren Sie den ElevenLabs-Support für Unterstützung.

Mobile Reaktionsfähigkeit

Stellen Sie sicher, dass das Widget nahtlos auf mobilen Geräten funktioniert, da viele Benutzer Websites über Smartphones oder Tablets aufrufen.

1. Verwenden Sie den Mobile Editor von Wix, um die mobile Ansicht Ihrer Website zu überprüfen.
2. Testen Sie das Widget auf physischen Geräten, um seine Funktionalität und Benutzerfreundlichkeit zu bestätigen.
3. Überprüfen Sie auf überlappende Elemente oder Formatierungsprobleme. Wenn Anpassungen erforderlich sind, verwenden Sie die mobilen Design-Tools von Wix, um Platzierung und Größe zu optimieren.

JavaScript-Debugging-Tipps

Wenn Ihr Widget nicht wie erwartet funktioniert, können Browser-Entwicklertools helfen, Probleme zu identifizieren.

1. Öffnen Sie Ihre Website in einem Browser (Chrome empfohlen).
2. Klicken Sie mit der rechten Maustaste irgendwo auf die Seite und wählen Sie Untersuchen, um die DevTools zu öffnen.
3. Gehen Sie zum Tab Konsole und suchen Sie nach Fehlermeldungen im Zusammenhang mit dem Widget.
4. Wenn Sie Fehler sehen, überprüfen Sie den JavaScript-Einbettungscode und stellen Sie sicher, dass alle erforderlichen URLs zur Allowlist hinzugefügt wurden. Diese Methode kann auch fehlende Abhängigkeiten oder andere Probleme aufzeigen, die das Funktionieren des Widgets verhindern.

Abschließende Gedanken

Die Integration des ElevenLabs Conversational AI-Widgets in Wix erfordert eine sorgfältige Einrichtung, aber mit den richtigen Schritten können Sie es schnell zum Laufen bringen. Stellen Sie sicher, dass Sie einen Wix Premium-Plan haben, befolgen Sie die oben genannten Schritte und beheben Sie bei Bedarf häufige Probleme. Wenn Sie auf weitere Probleme stoßen, wenden Sie sich an den ElevenLabs-Support für Unterstützung.

Oder, falls Sie es noch nicht getan haben, melden Sie sich noch heute für Conversational AI an.