Widget

De makkelijkste manier om je Oswald chatbot te integreren in je website (HTML) is via de ingebouwde widget. Je kan deze widget configureren door onder Integraties te kiezen voor Widget. Je hebt de vrijheid om deze widget te configureren naar jouw stijl. Daar heb je de volgende parameters:
Naam.
Beschrijving
Widget titel
De titel op de widget.
Widget ondertitel
De ondertitel op de widget.
Widget bubble text
De tekst op de knop van de widget.
Primaire kleur
De primaire kleur van de widget en de kleur van de tekstballonnen van de berichten van de chatbot.
Secundaire kleur
De kleur van de tekstballonnen van de berichten van de gebruiker.
Kleur overname
De kleur van de tekstballonnen van de berichten van een customer agent.
Kleur tekst
De kleur van de tekst van de berichten van de chatbot.
Secundaire kleur tekst
De kleur van de tekst van de berichten van de gebruiker.
Kleur text takeover
De kleur van de tekst van de berichten van een customer agent.
Bericht plaatshouder
De tekst die op het inputveld van de gebruiker staat.
Vertraging bericht
Het aantal milliseconden tussen opeenvolgende berichten van de chatbot.
Url voor icoon
Een url naar een icoontje dat getoond wordt in de widget.
Url voor widget demo pagina
Een url naar de pagina waarop je de widget wil testen, zonder effectief de widget te integreren. Deze pagina wordt geopend als je op Test widget klikt in de instellingen van de chatbot.
Widget script
Een stukje HTML-code dat je kan plakken in de <body> van je webpagina. De widget zal dan in deze configuratie te zien zijn op die specifieke webpagina.
De widget integreren op je website is zo eenvoudig als de HTML-code plakken in de body van je webpagina. In dit stukje HTML-code kan je de sessie bepalen die voor de gebruiker gekozen moet worden. Op deze manier kan je dezelfde gebruiker steeds dezelfde sessie tonen. De gebruiker ziet dan bij opnieuw openen van de widget de recente berichten die hij of zij met de bot heeft uitgewisseld. Dit kan interessant zijn als de gebruiker geregeld van pagina wisselt terwijl hij de bot gebruikt. Je bepaalt de sessie van de gebruiker door ze in het widgetscript toe te voegen in de widgeturl, bijvoorbeeld:https://api.oswald.ai/api/v1/chats/<API TOKEN IN INSTELLINGEN>/widget?session=<DE SESSION DIE JE KIEST>
Merk op dat Oswald niet kan voorspellen hoe we je sessie binnenkrijgen of opslaan, daarom kiezen we een willekeurige code als sessie als je niets doorgeeft.
Je kan het uitzicht en het gedrag van de widget nog verder aanpassen doormiddel van de file upload knoppen onderaan het configuratiescherm. Hier kan je drie files opladen: de host.css, de widget.css en de widget.js file. 
De host.css file bevat de stylesheet die op de webpagina die de widget bevat (host) wordt ingeladen. Deze bepaalt de grootte en de plaats van de widget op de pagina.
De widget.css file bevat de extra stijlregels voor de widget zelf. De widget is immers opgemaakt uit iframes en het uitzicht hiervan kan je niet bepalen vanop de host pagina. Hierin pas je alle eigenschappen binnen de widget aan, bijvoorbeeld vorm en kleur.
De widget.js file geeft je de mogelijkheid om in de iframes van de widget javascript uit te laten voeren die specifiek voor jouw site moet gelden. Zo kan je extra functionaliteit toevoegen. Wees hier voorzichtig mee, nieuwe releases van ons platform kunnen het gedrag van de widget veranderen.
Je kan de widget ook testen door onder Instellingen voor Opties te kiezen en op Test widget te klikken.
Opgelet: je kan de widget enkel testen als de chatbot gepubliceerd is.
Opgelet: als je website beveiligd is om in een HTML iframe ingeladen te worden, kan je de URL voor widget demo pagina niet gebruiken en zal je een lege webpagina te zien krijgen. De widget zal wel werken.

Integraties - Previous

Inleiding

Next - Integraties

Oswald integration API

Last updated 3 months ago

Naam.	Beschrijving
Widget titel	De titel op de widget.
Widget ondertitel	De ondertitel op de widget.
Widget bubble text	De tekst op de knop van de widget.
Primaire kleur	De primaire kleur van de widget en de kleur van de tekstballonnen van de berichten van de chatbot.
Secundaire kleur	De kleur van de tekstballonnen van de berichten van de gebruiker.
Kleur overname	De kleur van de tekstballonnen van de berichten van een customer agent.
Kleur tekst	De kleur van de tekst van de berichten van de chatbot.
Secundaire kleur tekst	De kleur van de tekst van de berichten van de gebruiker.
Kleur text takeover	De kleur van de tekst van de berichten van een customer agent.
Bericht plaatshouder	De tekst die op het inputveld van de gebruiker staat.
Vertraging bericht	Het aantal milliseconden tussen opeenvolgende berichten van de chatbot.
Url voor icoon	Een url naar een icoontje dat getoond wordt in de widget.
Url voor widget demo pagina	Een url naar de pagina waarop je de widget wil testen, zonder effectief de widget te integreren. Deze pagina wordt geopend als je op `Test widget` klikt in de instellingen van de chatbot.
Widget script	Een stukje HTML-code dat je kan plakken in de `<body>` van je webpagina. De widget zal dan in deze configuratie te zien zijn op die specifieke webpagina.