Incorporación de la conversación web en la página
Para añadir el widget de chat web a su sitio web, debe incrustar un elemento de script generado en su código fuente HTML.
La integración del chat web se incluye automáticamente para cada asistente y se configura por separado para cada entorno.
Para la integración de webchat con una aplicación basada en React, consulte las formas alternativas aquí.
Para añadir el chat web a su sitio web:
-
En el
de la página Integraciones, busque el mosaico Chat web y haga clic en Abrir. Se abrirá la ventana Abrir conversación web.
-
En el campo Entorno, seleccione el entorno al que desea que se conecte el widget de conversación web. Pulse Confirmar.
Se abrirá la página Conversación web, que muestra los valores de la integración de conversación web en el entorno seleccionado.
El panel de vista previa muestra cómo se verá el chat web cuando se incruste en una página web. Si observa un mensaje que comienza con
There is an error
, probablemente aún no haya añadido ninguna acción al asistente. Después de añadir una acción, puede probar la conversación desde el panel de vista previa. -
Pulse el separador Incorporar.
Se genera un fragmento de código basado en la configuración de la conversación web. Usted (o un desarrollador web) añadirá este fragmento de código a la página web en la que debe aparecer la conversación web.
Este fragmento de código contiene un elemento HTML
script
. El script llama a código JavaScript que se aloja en un sitio de IBM y crea una instancia de un widget que se comunica con el asistente. -
Pulse el icono
Copiar en el portapapeles para copiar el script de incorporación en el portapapeles.
-
Edite el código fuente HTML para la página web en la que deba aparecer el widget de conversación web. Pegue el fragmento de código en la página. Pegue el código lo más cerca posible de la etiqueta
</body>
de cierre para asegurarse de que la página se visualiza con mayor rapidez.No modifique los valores de propiedad
integrationID
oregion
en el script de incorporación generado.Si no está preparado para añadir la conversación web a un sitio web activo, puede probarlo rápidamente utilizando un archivo HTML local. Utilice este código HTML como fuente para una página de prueba:
<html> <head></head> <body> <title>My Test Page</title> <p>The body of my page.</p> <!-- copied script elements --> </body> </html>
Copie este código en un archivo con la extensión.
.html
, y reemplace el elemento.script
con el script de incrustación que copió en el paso anterior.Los identificadores del script de inclusión (como
integrationID
serviceInstanceID
) no se consideran secretos y son visibles para cualquiera que tenga acceso a su sitio web. Para obtener más información, consulte Seguridad. -
Si el sistema que aloja su sitio web tiene acceso limitado a Internet (por ejemplo, si utiliza un proxy o un cortafuegos), asegúrese de que se pueda acceder a las URL que alojan el chat web. Para obtener más información, consulte Acceso a hosts de conversación web.
-
Abra la página web (o el archivo de prueba local) en el navegador. Debería ver el icono del iniciador
en la página:
-
Pulse el icono del lanzador para abrir la ventana de conversación.
-
Pegue el mismo script de incorporación en cada página web en la que desee que el asistente esté disponible para los clientes.
Puede pegar el mismo código de script en tantas páginas de su sitio web como desee. Añádalo allí donde desee que los usuarios puedan acceder a su asistente para obtener ayuda. Sin embargo, asegúrese de añadirlo solo una vez en cada página.
Ahora puede probar el asistente y ver sus respuestas igual que lo harían sus clientes.
Sin embargo, antes de utilizar la conversación web en producción, probablemente deseará personalizarlo para su sitio y para las necesidades de sus clientes. Para obtener más información, consulte Visión general del desarrollo de conversaciones web.