Zum Hauptinhalt springen

Ihren Einbettungscode erhalten

Der Einbettungscode ist auf der Bereitstellungsseite Ihres Agenten im Humanizing Agents Dashboard verfügbar.
1

Zu Ihrem Agenten navigieren

Öffnen Sie Ihren Agenten aus der Agentenliste in Ihrem Arbeitsbereich.
2

Zur Bereitstellung gehen

Klicken Sie auf den Tab Bereitstellung in den Agenteneinstellungen.
3

Einbettungscode kopieren

Kopieren Sie das bereitgestellte JavaScript-Snippet.

Grundlegende Einbettung

Fügen Sie das folgende Skript zu Ihrer Website hinzu, typischerweise direkt vor dem schließenden Body-Tag:
<script
  src="https://chat.humanizing.com/embed.js"
  data-agent-id="YOUR_AGENT_ID"
  async
></script>
Ersetzen Sie YOUR_AGENT_ID durch Ihre tatsächliche Agenten-ID aus dem Dashboard.

Einbettungsmethoden

Methode 1: Script-Tag (Empfohlen)

Die einfachste Methode - funktioniert mit jeder Website:
<\!DOCTYPE html>
<html>
<head>
  <title>My Website</title>
</head>
<body>
  <\!-- Your website content -->

  <\!-- Chat Widget (place before closing body) -->
  <script
    src="https://chat.humanizing.com/embed.js"
    data-agent-id="YOUR_AGENT_ID"
    async
  ></script>
</body>
</html>

Methode 2: Dynamisches Laden

Laden Sie das Widget nach dem Seitenaufbau für bessere Leistung:
window.addEventListener("load", function() {
  const script = document.createElement("script");
  script.src = "https://chat.humanizing.com/embed.js";
  script.setAttribute("data-agent-id", "YOUR_AGENT_ID");
  script.async = true;
  document.body.appendChild(script);
});

Konfigurationsoptionen

Konfigurieren Sie das Widget-Verhalten mit Data-Attributen:
AttributTypBeschreibung
data-agent-idstringErforderlich. Ihre Agenten-ID aus dem Dashboard
data-positionstringWidget-Position: bottom-right (Standard), bottom-left
data-open-on-loadbooleanWidget automatisch beim Laden der Seite öffnen
data-hide-buttonbooleanDie schwebende Chat-Schaltfläche ausblenden

Installation überprüfen

Nach dem Hinzufügen des Einbettungscodes:
  1. Cache leeren - Stellen Sie sicher, dass Sie die neueste Version Ihrer Seite sehen
  2. Chat-Schaltfläche suchen - Eine schwebende Schaltfläche sollte in der Ecke erscheinen
  3. Klicken zum Öffnen - Die Chat-Oberfläche sollte sich reibungslos öffnen
  4. Konversation testen - Senden Sie eine Testnachricht, um die Verbindung zu überprüfen
Verwenden Sie die Entwicklertools Ihres Browsers (F12), um nach JavaScript-Fehlern zu suchen, falls das Widget nicht erscheint.

Fehlerbehebung

  • Überprüfen Sie, ob die Agenten-ID korrekt ist
  • Stellen Sie sicher, dass Ihr Agent bereitgestellt ist (nicht im Entwurfsmodus)
  • Prüfen Sie, ob JavaScript-Fehler in der Konsole vorliegen
  • Überprüfen Sie CSS-Konflikte mit z-index
  • Überprüfen Sie, ob Ihre Domain in den Agenteneinstellungen erlaubt ist
  • Stellen Sie sicher, dass Ihre Website HTTPS verwendet
  • Prüfen Sie, ob Werbeblocker stören
  • Das Widget ist für responsives Design konzipiert
  • Das Avatar-Panel wird auf Mobilgeräten ausgeblendet (erwartetes Verhalten)
  • Überprüfen Sie, ob das Viewport-Meta-Tag vorhanden ist

Sicherheitshinweise

Das Widget funktioniert nur auf Domains, die Sie in Ihren Agenteneinstellungen autorisiert haben. Nicht autorisierte Domains erhalten einen Verbindungsfehler.
  • Verwenden Sie immer HTTPS auf Ihrer Website
  • Halten Sie Ihre Agenten-ID vertraulich (obwohl sie im Seitenquelltext sichtbar ist)
  • Konfigurieren Sie erlaubte Domains im Dashboard

Nächste Schritte