Widget configuratie

De widget wordt geconfigureerd via je agent-instellingen in het dashboard. De meeste opties zoals kleur, welkomstbericht, positie en thema worden server-side beheerd.

Embed code

De enige vereiste configuratie in de embed code is je agent ID:

<script
  src="https://denkchat.nl/widget.js"
  data-agent-id="JOUW_AGENT_ID"
></script>

Configuratie via dashboard

Alle visuele en functionele instellingen worden beheerd in Dashboard > Agent > Instellingen:

• Primaire kleur — De accentkleur van de widget
• Welkomstbericht — Het eerste bericht dat bezoekers zien
• Positie — Links of rechts onderin de pagina
• Thema — Light of dark mode
• Suggested messages — Voorgestelde vragen die bezoekers kunnen aanklikken
• Keuzeknoppen (quick replies) — Laat de bot bij keuzevragen klikbare antwoordopties tonen
• Productkaarten & filter — Toon producten als kaarten en filter betrouwbaar op eigenschappen
• Lead capture — Verzamel contactgegevens voor of tijdens het gesprek
• Feedback — Laat bezoekers het gesprek beoordelen
• Branding — Toon of verberg "Powered by Denkchat"

Bronvermelding

Onder AI-antwoorden die op je kennisbank gebaseerd zijn, toont de widget automatisch een "Gebaseerd op"-regel met maximaal drie bronnen. Website-pagina's zijn klikbaar (openen in een nieuw tabblad); geüploade documenten tonen alleen de bestandsnaam. Er is geen configuratie nodig — de bronnen worden per antwoord bepaald en alleen getoond als het antwoord aantoonbaar uit de kennisbank komt. Bij begroetingen of doorverwijzingen verschijnt er dus geen bronregel.

Keuzeknoppen (quick replies)

Staat Keuzeknoppen aan (Dashboard > Agent > Chat interface), dan biedt de bot bij een gesloten vraag de antwoordopties als klikbare knoppen aan — de bezoeker tikt een optie aan in plaats van te typen. De knoppen verschijnen onder het botbericht en verdwijnen zodra de bezoeker antwoordt. De bot bepaalt zelf wanneer een vraag zich hiervoor leent; bij open vragen blijft normaal typen.

Productkaarten & filter

Staat Productkaarten & filter aan (Dashboard > Agent > Chat interface), dan kan de bot producten als kaarten tonen (met foto, prijs en "In winkelwagen"-knop) en betrouwbaar filteren op categorie, producteigenschappen (bijv. merk, huidtype, bescherming), prijs en voorraad. Dit vereist dat er productgegevens in de agent staan — via de WooCommerce-koppeling of via de Product Sync API.

De bot zoekt eerst in de productcatalogus en kiest daarna zelf welke van de gevonden producten hij als kaart toont — alleen wat hij daadwerkelijk aanraadt, hoofdadvies eerst. De gegevens op de kaart (naam, prijs, afbeelding, link) komen altijd rechtstreeks uit de gesynchroniseerde catalogus en nooit uit de tekst van het model, dus een verzonnen product of prijs kan nooit op een kaart belanden.

Twee dingen bepalen hoe goed dit werkt:

• Categorieën scheiden productsoorten die op elkaar lijken. Zonder categorieën kan een vraag om een zonnebankcrème ook zonnebrandproducten opleveren, omdat de teksten inhoudelijk dicht bij elkaar liggen.
• Eigenschappen die niet in je webshop getagd zijn, kan de bot niet als filter gebruiken. Hij zegt dan eerlijk dat het er niet bij vermeld staat in plaats van te gokken — hoe vollediger je producten getagd zijn, hoe scherper het advies.

Alternatieve integratie

Als je de widget vanuit JavaScript wilt laden (bijv. in een SPA), kun je de globale variabelen gebruiken:

// Stel agent ID in voordat het script laadt
window.__DENKCHAT_AGENT_ID = 'JOUW_AGENT_ID';

// Optioneel: overschrijf de base URL (standaard afgeleid van script src)
window.__DENKCHAT_BASE_URL = 'https://denkchat.nl';

// Laad het script
const script = document.createElement('script');
script.src = 'https://denkchat.nl/widget.js';
document.head.appendChild(script);

Privacy

De widget toont een privacy-melding bij het eerste bezoek. Deze wordt onthouden per browser via localStorage. Bezoekers moeten akkoord gaan voordat ze kunnen chatten.

Visitor metadata

De widget verzamelt automatisch de volgende metadata per sessie:

• E-mailadres — Als lead capture is ingeschakeld
• IP-adres — Voor locatiebepaling
• User agent — Browser/device informatie
• Land en stad — Via GeoIP lookup (automatisch op basis van IP)

Deze gegevens zijn zichtbaar in het gesprekkendetail in je dashboard.