Het Lab in de Web Widget-inspector

Benodigde licentie

App pluscloud AI Agent Preview
Abonnement Suite Team of hoger, Support Team of hoger

Het Lab past aanpassingen toe op de echte Web Widget van een website, alleen in je browser, zodat je ze uitprobeert vóór je de code van de site wijzigt. Bezoekers merken er niets van. Het Lab is een tabblad van de Web Widget-inspector; hoe je die aanzet, staat in Aan de slag met de Web Widget-inspector.

Een aanpassing uitproberen op de echte widget

  1. Open het tabblad Lab.
  2. Wil je beginnen met wat de site al instelt, klik dan op Begin met de customization van de site. De editor bevat dan de aanpassingen, de taal, zIndex, cookies en behavior van de site.
  3. Zet Lab op deze site aan. De widget volgt elke wijziging direct, en het Lab blijft na herladen aan tot je het uitzet.
  4. Wijzig opties in de editor onder de onderdelen van het Lab. Het is dezelfde editor als Web Widget-aanpassingen in de preview, met elke gedocumenteerde optie; zie De aanpassingsopties van de Web Widget. Bij Taal van de widget (locale) stel je de taal van de widget in; laat het leeg om de taal van de site te houden.
  5. Let op de meldingen onder de opties. Een waarde die de widget zou weigeren, wordt gemarkeerd, met wat de widget dan overslaat. Een ongeldige kleur laat hem de hele aanroep negeren.
  6. Klik op Code kopiëren. Je krijgt de zE-aanroepen voor je instellingen; die komen op de site na de widgetsnippet. Dezelfde code staat onderaan het tabblad, bij Code.

Het tabblad Lab van de Web Widget-inspector met Lab op deze site aangezet, de knoppen Begin met de customization van de site, Code kopiëren, Openen in AI agent-preview en Wissen en herladen, het veld Taal van de widget (locale), en de ingeklapte onderdelen Embedded mode testen, Artikel openen in de widget, Verborgen schermen, Berichtveld vooraf invullen en Voorbeeld van proactief bericht, elk gemarkeerd als Experimenteel, en Zendesk-debugschakelaars, gemarkeerd als Ongedocumenteerd.

Wissen en herladen haalt je instellingen in het Lab en de tests van het Lab op deze pagina weg en herlaadt, zodat je de widget ziet zoals de site hem heeft. Lab op deze site uitzetten kan ook, maar de widget houdt je aanpassingen dan tot de pagina herlaadt.

De editor heeft ook twee opties die Zendesk niet documenteert, gemarkeerd als Ongedocumenteerd: het scherm vóór het gesprek en de verbergknop in de koptekst. Wat dat betekent, staat in Experimentele en ongedocumenteerde functies van de Web Widget.

Als herladen of een nieuwe bezoeker nodig is

Een balk bovenaan het Lab zegt het als een wijziging pas na herladen zichtbaar wordt, zoals de test met embedded mode, het overslaan van de widget, de debugschakelaars of het uitzetten van het Lab. Pagina herladen past hem toe.

Het scherm vóór het gesprek en het voorbeeld van een proactief bericht verschijnen alleen bij een bezoeker zonder gesprek. Dan biedt de balk Begin als nieuwe bezoeker, dat de gegevens van de widget uit de opslag van deze site in je browser haalt en herlaadt. Je huidige gesprek op de site is daarna in deze browser niet meer te openen.

Het contrast controleren

Onder de editor toont Contrast de vijf combinaties van tekst en achtergrond in de widget: primary, message, action, de berichten van de AI-agent en de achtergrond. Bij elke combinatie staan de kleuren, waar ze vandaan komen (Beheercentrum, de site, het Lab, de standaard), de contrastverhouding en een niveau: AAA, AA, Alleen grote tekst of Te laag. Gewone tekst heeft minstens 4,5:1 nodig. De lijst volgt je wijzigingen terwijl je ze maakt.

Het onderdeel Contrast van het Lab met vijf kleurcombinaties. De combinatie action gebruikt de kleur #B5482A uit het lab op wit en haalt 5,35 op 1, niveau AA; de andere combinaties halen AAA. Daaronder toont het onderdeel Code de zE-aanroep customization met de action-kleur uit het lab en de avatarpositie top.

Embedded mode testen

In embedded mode staat de widget in een element van de pagina in plaats van zwevend. Zendesk documenteert dat voor ontwikkelaars. De test toont het op de echte pagina, alleen in je browser.

  1. Open Embedded mode testen en kies Volledige widget of Gesplitste weergave, die de gesprekkenlijst en het gesprek op twee plekken zet.
  2. Klik op Plek kiezen en klik op een element van de pagina. Pijl omhoog kiest een groter element, pijl omlaag gaat terug, Enter kiest en Esc annuleert.
  3. Lees de meldingen onder de plek. De widget vult zijn element: onder 300 pixels hoog wordt hij afgesneden of is hij onzichtbaar, en hij heeft ongeveer 300 pixels breedte nodig. Een leeg element met een vaste hoogte werkt het best.
  4. Klik op Test starten. De pagina herlaadt met de widget op die plek. Test stoppen zet hem terug.

Bij Embedcode staat de code voor de site: automatisch renderen uit, dan een regel waar je Web Widget-fragment uit het Beheercentrum komt, daarna de render-aanroep met jouw plek.

Het onderdeel Embedded mode testen met Volledige widget gekozen, de gekozen plek #help-chat van 1144 bij 604 pixels, de knop Test starten en de embedcode met window.zEMessenger autorender false, een commentaarregel die zegt dat je hier de Web Widget-code uit Admin Center plakt, en de render-aanroep in embedded mode.

De instellingen van de site meenemen naar de AI agent-preview

Openen in AI agent-preview kopieert de widgetsleutel en de aanpassingen van de site, met die van het Lab als het Lab aan staat, naar de preview van dat Zendesk-account in de extensie, en opent het AI agents-dashboard in een nieuw tabblad. Ze vervangen de eigen aanpassingen van de preview voor dat account. De widgetsleutel bepaalt dan het ontwerp in de preview, ook boven de Web Widget van het merk van de AI-agent. De preview zegt één keer waar de instellingen vandaan komen. Zo test je de AI-agent in het ontwerp van de site. Hoe je ze in de preview wijzigt of weghaalt, staat in De aanpassingsopties van de Web Widget.

Zie ook

Was dit artikel nuttig?

0

Kom je er niet uit?

Ons supportteam kijkt met je mee.

Opmerkingen

0 opmerkingen

U moet u aanmelden om een opmerking te plaatsen.