For utviklere

Integrasjonsdokumentasjon.

Vera er en script-tag-basert widget. Én linje kode er nok for å aktivere chatboten på en hvilken som helst nettside, uavhengig av teknologi-stack.

Kom i gang

Minimalinstallasjon

Lim inn scriptet rett før </body> på siden. Widgeten laster asynkront og blokkerer ikke sideinnlasting.

HTML
<script
  src="https://vera-widget.pages.dev/widget.js"
  data-license="VERA-XXXX-XXXX-XXXX"
  defer
></script>

Erstatt VERA-XXXX-XXXX-XXXX med lisensnøkkelen fra dashboardet. Nøkkelen er bundet til et spesifikt domene og valideres server-side ved hvert kall.

Attributter

Data-attributter

Widgeten konfigureres via data-*-attributter på script-taggen. Verdier satt her overstyrer dashboardkonfigurasjonen.

AttributtTypePåkrevdBeskrivelse
data-licensestringJaLisensnøkkelen knyttet til domenet. Genereres automatisk i dashboardet. Nøkkelen er domenebegrenset og vil ikke fungere fra andre opprinnelser.
data-primary-colorstring (hex)NeiPrimærfarge for widget-topp og boble. Standard: verdien satt i dashboardet.
data-position"bottom-right" | "bottom-left"NeiPosisjon av chat-boblen. Standard: bottom-right.
HTML — med valgfrie attributter
<script
  src="https://vera-widget.pages.dev/widget.js"
  data-license="VERA-XXXX-XXXX-XXXX"
  data-primary-color="#0066ff"
  data-position="bottom-left"
  defer
></script>
Isolasjon

Shadow DOM og stil-isolasjon

Widgeten bruker lukket Shadow DOM (mode: "closed"). Det betyr at eksisterende CSS på siden ikke påvirker widgeten, og widgetens stiler ikke lekker ut. Ingen ekstra reset eller scoping er nødvendig.

JavaScript — manuell kontroll (valgfritt)
// Widgeten eksponerer ingen globalt API.
// All konfigurasjon skjer via data-attributter på script-taggen.

// Eksempel: CSP-header som tillater widget-scriptet
Content-Security-Policy:
  script-src 'self' https://vera-widget.pages.dev;
  connect-src 'self' https://vera-worker.emisolutions.workers.dev;

Dersom siden bruker en Content Security Policy må du tillate vera-widget.pages.dev under script-src og worker-endepunktet under connect-src.