Incorporare la web chat nella propria pagina
Per aggiungere il widget della chat web al proprio sito web, è necessario incorporare un elemento di script generato nel sorgente HTML.
L'integrazione della chat web è inclusa automaticamente per ogni assistente AI e viene configurata separatamente per ogni ambiente.
Per l'integrazione della webchat con un'applicazione basata su React, vedere le modalità alternative qui.
Per aggiungere la web chat al vostro sito web:
Nella pagina delle integrazioni di '
, individuare il riquadro della chat Web e fare clic su Apri. Si apre la finestra Apri chat web.Nel campo Ambiente, selezionare l'ambiente a cui si desidera che il widget della chat web si connetta. Fare clic su Conferma.
Si apre la pagina Web chat, che mostra le impostazioni per l'integrazione della Web chat nell'ambiente selezionato.
Il riquadro di anteprima mostra l'aspetto della web chat quando viene incorporata in una pagina web. Se viene visualizzato un messaggio che inizia con "
There is an error, probabilmente non è stata ancora aggiunta alcuna azione all'assistente AI. Dopo aver aggiunto un'azione, è possibile testare la conversazione dal pannello di anteprima.Fai clic sulla scheda Embed.
Viene generato uno snippet di codice in base alla configurazione della chat web. L'utente (o uno sviluppatore web) aggiungerà questo frammento di codice alla pagina web in cui si desidera che appaia la chat web.
Questo frammento di codice contiene un elemento HTML '
script. Lo script richiama il codice JavaScript ospitato su un sito IBM e crea un'istanza di un widget che comunica con l'assistente AI.Fare clic sull'icona '
Copia negli appunti per copiare lo script incorporato negli appunti.Modificare l'origine HTML della pagina web in cui si desidera visualizzare il widget della chat web. Incolla il frammento di codice nella pagina. Incollare il codice il più vicino possibile al tag di chiusura '
</body>per garantire un rendering più veloce della pagina.Non modificare i valori delle proprietà '
integrationIDo 'regionnello script generato.Se non siete pronti ad aggiungere la web chat a un sito web live, potete testarla rapidamente utilizzando un file HTML locale. Utilizzate questo codice HTML come sorgente per una pagina di prova:
<html> <head></head> <body> <title>My Test Page</title> <p>The body of my page.</p> <!-- copied script elements --> </body> </html>Copiate questo codice in un file con estensione '
.htmle sostituite l'elemento 'scriptcon lo script di incorporamento copiato nel passaggio precedente.Gli identificatori nello script di incorporamento (come '
integrationID'serviceInstanceID) non sono considerati segreti e sono visibili a chiunque abbia accesso al vostro sito web. Per ulteriori informazioni, vedere Sicurezza.Se il sistema che ospita il vostro sito web ha un accesso limitato a Internet (ad esempio, se utilizzate un proxy o un firewall), assicuratevi che gli URL che ospitano la chat web siano accessibili. Per ulteriori informazioni, vedere Accesso agli host della chat web.
Aprire la pagina web (o il file di test locale) nel browser. Dovresti vedere l'icona del programma di avvio
visualizzata sulla pagina.Fare clic sull'icona del launcher per aprire la finestra di chat.
Incollare lo stesso script embed in ogni pagina web in cui si desidera che l'assistente AI sia disponibile per i clienti.
Puoi incollare la stessa tag di script in tutte le pagine del tuo sito web che desideri. Aggiungetelo ovunque vogliate che gli utenti possano raggiungere il vostro assistente AI per chiedere aiuto. Tuttavia, assicuratevi di aggiungerlo solo una volta per ogni pagina.
Ora potete testare il vostro assistente AI e vedere le sue risposte proprio come farebbero i vostri clienti.
Prima di mettere in produzione la web chat, tuttavia, probabilmente vorrete personalizzarla per il vostro sito e per le esigenze dei vostri clienti. Per ulteriori informazioni, vedere Panoramica sullo sviluppo delle chat Web.