Flow.Documentatie
ProfessionalWorkflows

Toon widget: gegevens als kaart

4 stappen± 3 minVideoGecontroleerd 22 okt 2026
  1. Stap 1 · Open Flow en maak een workflow
  2. Stap 2 · Kies de widget en vul hem
  3. Stap 3 · Zet de stappen op één lijn en sla op
  4. Stap 4 · Voer uit en bekijk de kaart

Een chat-widget is een kaart, tabel of grafiek die in de chat verschijnt. Met Toon widget vult een workflow zo'n widget met zijn eigen gegevens. Roept een AI Collega de workflow aan, dan ziet de gebruiker in de chat geen lap tekst maar de kaart. In de Studio ziet u het resultaat meteen onder de uitvoer.

Bekijk de hele handleiding als video4 stappen in één film
Stap 1 / 4

Open Flow en maak een workflow

Klik in de portal bij Omgevingen op Ontwikkeling en daar op Openen; Flow opent in een nieuw tabblad. Klik daar op + naast Algemeen, kies Nieuwe workflow en geef hem een naam. Een nieuwe workflow begint met een Event trigger: het punt waar hij start.

  1. Klik op Ontwikkeling
Open Flow en maak een workflow · Klik op Ontwikkeling
  1. Klik op Openen ↗
Open Flow en maak een workflow · Klik op Openen ↗
  1. Klik op Toevoegen aan Algemeen
Open Flow en maak een workflow · Klik op Toevoegen aan Algemeen
  1. Klik op Nieuwe workflow
Open Flow en maak een workflow · Klik op Nieuwe workflow
  1. Vul in bij Workflownaam: Gids · orderkaart
Open Flow en maak een workflow · Vul in bij Workflownaam: Gids · orderkaart
Stap 2 / 4

Kies de widget en vul hem

Voeg Toon widget toe en kies de widget. Onder Gegevens (Code) geeft u ieder veld van de widget een waarde, met {{veld}} uit de workflow. Deze widget heeft een titel, een status en een bedrag.

  1. Klik op Node toevoegen
Kies de widget en vul hem · Klik op Node toevoegen
  1. Klik op Toon widget
Kies de widget en vul hem · Klik op Toon widget
  1. Vul in bij Naam: Toon de order
  2. Kies bij Widget: Gids · orderkaart · concept
Kies de widget en vul hem · Vul in bij Naam: Toon de order; Kies bij Widget: Gids · orderkaart · concept
  1. Klik op Code
Kies de widget en vul hem · Klik op Code
  1. Vul in bij de gegevens: `{
Kies de widget en vul hem · Vul in bij de gegevens: `{; ; ; ;
  1. Klik op het bolletje van ‘Event trigger’
Kies de widget en vul hem · Klik op het bolletje van ‘Event trigger’
  1. Klik op het bolletje van ‘Toon de order’
Kies de widget en vul hem · Klik op het bolletje van ‘Toon de order’
Stap 3 / 4

Zet de stappen op één lijn en sla op

Selecteer de stappen (klik de eerste, en de andere met Shift ingedrukt) en klik op Horizontaal uitlijnen: dan staan ze op één lijn en leest u de workflow van links naar rechts; een tak (zoals Nee van een If / Else) krijgt een eigen rij eronder. Passend maken zet alles in beeld; daarna Opslaan.

  1. Klik op ‘Event trigger’
Zet de stappen op één lijn en sla op · Klik op ‘Event trigger’
  1. Klik op ‘Toon de order’ met Shift ingedrukt
Zet de stappen op één lijn en sla op · Klik op ‘Toon de order’ met Shift ingedrukt
  1. Klik op Horizontaal uitlijnen
Zet de stappen op één lijn en sla op · Klik op Horizontaal uitlijnen
  1. Klik op Passend maken
Zet de stappen op één lijn en sla op · Klik op Passend maken
  1. Klik op Opslaan
Zet de stappen op één lijn en sla op · Klik op Opslaan
Stap 4 / 4

Voer uit en bekijk de kaart

Onderin staat dat de widget gevuld is, en daaronder de kaart zelf, zoals hij in de chat verschijnt. Zolang de widget niet gepubliceerd is, gebruikt de stap het concept; publiceer hem voordat de workflow live gaat.

  1. Klik op Voer uit
Voer uit en bekijk de kaart · Klik op Voer uit
Voer uit en bekijk de kaart · Status: Afgerond.
Voer uit en bekijk de kaart · De widget is gevuld (concept).
Voer uit en bekijk de kaart · De kaart, met het ordernummer als titel.

Deze handleiding is op 22 okt 2026 stap voor stap uitgevoerd door een geautomatiseerde test op Flow (versie 3e563176).