Überblick über die Entwicklung von Webchats

Stil und Inhalt des Web-Chats

Anpassen des Erscheinungsbilds des Web-Chats: Wenn Sie das Design und das Erscheinungsbild des Web-Chats über die Optionen hinaus anpassen möchten, die auf der Registerkarte „Design“ in den Web-Chat-Einstellungen verfügbar sind, können Sie dies tun, indem Sie ein anderes Carbon-Design-Theme auswählen.

Die unterstützten Designs sind Farbschemata, die durch das „ IBM Carbon Design “ definiert sind. Um das Carbon-Design zu aktivieren, verwenden Sie die carbonTheme Konfigurationsoption.

Sie können auch individuelle Variablen innerhalb des Themas festlegen, um bestimmte Elemente der Benutzeroberfläche anzupassen. Der im Chatfenster angezeigte Text verwendet beispielsweise die Schriftarten IBMPlexSans, Arial, Helvetica, sans-serif. Wenn Sie eine andere Schriftart verwenden möchten, können Sie diese mithilfe der updateCSSVariables() Instanzmethode festlegen.

Anpassung des Startbildschirms: Der Startbildschirm begrüßt den Kunden und zeigt optional eine Liste mit Vorschlägen für Gesprächseinstiege an. Sie können den Stil und den Inhalt der Hauptanzeige anpassen:

• Um Elemente zum Startbildschirm hinzuzufügen, kannst du mithilfe der writeableElements.homeScreenAfterStartersElement Theming-Variablen benutzerdefinierten HTML-Code festlegen:

        instance.writeableElements.homeScreenAfterStartersElement.innerHTML = 
          '<div class="MyCustomClass">This is my custom element</div>';

Beispiel: Ein praktisches Beispiel, das zeigt, wie man benutzerdefinierte Elemente zum Startbildschirm hinzufügt, finden Sie unter „Benutzerdefinierte Elemente für den Startbildschirm des AI Assistant Builder Web-Chats “.

• Um den Stil des Startbildschirms zu ändern, verwende CSS-Hilfsklassen.

Anpassung von Texten: Sie können die Texte anpassen, die die verschiedenen Bezeichnungen und fest programmierten Formulierungen des Web-Chats definieren. Um Zeichenfolgen anzupassen, verwenden Sie die updateLanguagePack() Instanzmethode, um Zeichenfolgen im aktuellen Sprachpaket zu ersetzen. Weitere Informationen finden Sie unter „Sprachen “.

Unterstützung für ein internationales Publikum: Standardmäßig werden die im Web-Chat angezeigten Texte auf Englisch angezeigt. Um zu einer anderen Sprache zu wechseln, verwenden Sie die updateLanguagePack() Instanzmethode, um das aktuelle Sprachpaket durch eines der verfügbaren übersetzten Sprachpakete zu ersetzen. Weitere Informationen finden Sie unter Unterstützung für ein globales Publikum im Webchat.

Öffnen, Schließen und Darstellen des Web-Chat-Fensters

Den Standard-Launcher ersetzen: Um eine bessere Integration in Ihre Website zu erreichen, möchten Sie vielleicht das integrierte Launcher-Symbol durch eine andere Methode zum Öffnen des Web-Chats ersetzen. Um den Standard-Launcher auszublenden, setzen Sie die showLauncher Konfigurationsoption auf false. Um den Web-Chat aufgrund einer anderen Interaktion zu öffnen, verwenden Sie die openWindow Instanzmethode.

Anleitung: Eine Anleitung zur Implementierung eines benutzerdefinierten Startprogramms finden Sie unter „Verwenden eines benutzerdefinierten Startprogramms “.

Den Web-Chat immer geöffnet lassen: Wenn Sie den Web-Chat auf Ihrer Seite immer geöffnet lassen möchten, verwenden Sie die openChatByDefault Konfiguration „open“, um die Seite mit geöffnetem Chat-Fenster anzuzeigen, und die hideCloseButton Option, um zu verhindern, dass Kunden es schließen.

Größe oder Position des Web-Chats ändern: Je nach Gestaltung Ihrer Website kann es erforderlich sein, dass Sie ändern, wo und wie das Web-Chat-Fenster auf Ihrer Website angezeigt wird. So kann es beispielsweise an einer anderen Position auf der Seite oder in einer anderen Größe erscheinen oder in ein anderes Element auf der Seite eingebettet sein.

Um die Größe des Webchat-Fensters anzupassen, können Sie die Instanzmethode „ updateCSSVariables( )“ verwenden, um die CSS-Stilvorgaben zu ändern.

Wenn Sie die Position des Web-Chat-Fensters ändern müssen oder die Größe über die im CSS erlaubten Grenzen hinaus ändern müssen, können Sie ein benutzerdefiniertes DOM-Element verwenden, um das Web-Chat-Fenster zu enthalten. Verwenden Sie dazu die element Konfigurationsoption.

Anleitung: Eine Anleitung, die zeigt, wie man den Web-Chat in einem benutzerdefinierten Element darstellt, finden Sie unter „Anleitung: Größe und Position des Web-Chats anpassen “.

Einbindung des Web-Chats in Ihre mobile Anwendung: Sie können eine WebView -Anwendung in Verbindung mit einer JavaScript -Brücke nutzen, um den Web-Chat in Ihre mobile Anwendung zu integrieren. Weitere Informationen finden Sie unter „Hinzufügen des Web-Chats zu Ihrer mobilen Anwendung “.

Das Gespräch individuell gestalten

Nachrichten abfangen und ändern: Durch das Abonnieren von Ereignissen kann Ihr Code Nachrichten abfangen, die zwischen dem Kunden und dem Assistenten gesendet und empfangen werden, und sogar deren Inhalt ändern.

Abonnieren Sie das pre:receive Ereignis, wenn Sie die Nachricht eines Kunden abfangen möchten, bevor sie an den KI-Assistenten gesendet wird. So können Sie z. B. personenbezogene Daten aus dem Nachrichtentext entfernen oder Kontextvariablen in die Nutzdaten der Nachricht aufnehmen.

Abonnieren Sie das pre:send Ereignis, wenn Sie eine eingehende Antwort des KI-Assistenten abfangen möchten, bevor sie dem Kunden angezeigt wird. Sie können zum Beispiel Formatierungen, Links oder andere Elemente hinzufügen, die für den Webchat spezifisch sind.

Anleitung: Eine Anleitung, in der gezeigt wird, wie man das pre:receive Ereignis nutzt, um eingehende Nachrichten abzufangen und zu ändern, finden Sie unter „Anleitung: Implementierung benutzerdefinierter Optionsschaltflächen im Web-Chat “.

Anzeige benutzerdefinierter Antworttypen: Wenn Ihr KI-Assistent spezielle Antworten unter Verwendung eines benutzerdefinierten Antworttyps (user_defined) sendet, können Sie eine benutzerdefinierte Ansicht implementieren, um diese Antworten im Web-Chat-Fenster anzuzeigen. Abonnieren Sie dazu das customResponse Ereignis, das jedes Mal ausgelöst wird, wenn eine user_defined Antwort eingeht. In Ihrer Event-Handler-Methode können Sie dann den Inhalt der Antwort lesen und die Ausgabe mit Ihren eigenen Elementen darstellen.

Anleitung: Eine Anleitung, wie Sie einen benutzerdefinierten Antworttyp als Ersatz für die Standardantwort „Optionen“ rendern können, finden Sie unter „Anleitung: Implementierung benutzerdefinierter Optionsschaltflächen im Web-Chat “.

Implementierung einer Contact-Center-Integration: Sie können eines der Web-Chat-Starter-Kits verwenden, um eine Integration mit einer Contact-Center-Plattform (Service Desk) durchzuführen, die nicht zu den im integrierten KI-Assistenten-Builder verfügbaren Integrationen gehört. Voll funktionsfähige Referenzimplementierungen sind für verschiedene Contact Center-Plattformen verfügbar. Darüber hinaus können Sie mit einem Starter Kit eine benutzerdefinierte Integration mit der Plattform Ihrer Wahl entwickeln.

Weitere Informationen finden Sie unter „Hinzufügen von Contact-Center-Support“.

Daten verwalten

Verwaltung von Benutzeridentitätsdaten: Der Web-Chat ordnet jeder Nachricht, die er an den KI-Assistenten sendet, eine Benutzer-ID zu; diese Benutzer-ID wird für die benutzerbasierte Abrechnung und andere Zwecke verwendet. Sie können entweder zulassen, dass der Web-Chat für jeden Benutzer eine anonyme ID generiert, oder Sie können die Benutzer-ID selbst festlegen.

Je nachdem, ob Sie die Sicherheitsfunktion für den Web-Chat aktiviert haben, können Sie entweder die updateUserID Instanzmethode oder die updateIdentityToken Methode verwenden, um die Identitätsdaten des Benutzers anzugeben.

Weitere Informationen darüber, wie Benutzeridentitätsinformationen angegeben werden und wie sie verwendet werden, finden Sie unter Verwalten von Benutzeridentitätsinformationen im Webchat.

Sicherheit und Verwaltung

Sicherheit des Web-Chats: Um den Web-Chat zu sichern, können Sie JSON Web Token (JWT) verwenden, um Benutzer zu authentifizieren und vertrauliche Daten zu verschlüsseln. Weitere Informationen finden Sie unter „Sicherheit des Web-Chats “.

Informationen zur Web-Chat-Version: Der von IBM Cloud gehostete Web-Chat-Code wird regelmäßig mit Verbesserungen und neuen Funktionen aktualisiert. Standardmäßig verwendet das Einbettskript automatisch die neueste Version des Webchats. Um unerwartete Änderungen zu vermeiden, die sich auf Ihre Website auswirken könnten, möchten Sie vielleicht kontrollieren, welche Version des Webchats Ihre Website verwendet, damit Sie die Möglichkeit haben, jede neue Version zu testen, bevor Sie sie in der Produktion einsetzen, um unerwartete Änderungen zu vermeiden, wenn eine neue Version veröffentlicht wird.

Weitere Informationen zur Versionierung des Webchats finden Sie unter Steuerung der Webchat-Version.