---
title: Widget på hjemmesiden, link til agenten og app på telefonen
description: Sådan implementeres agenten på hjemmesiden med én kodelinje, hvordan det korte link til sociale medier og beskedtjenester fungerer, og hvordan kunder installerer din agent som en app på deres telefon.
section: guide
keywords: widget til hjemmeside, implementer widget, widget kode, Tilda integration, Shopify integration, WordPress integration, link til AI agent, PWA app, push notifikationer, link forhåndsvisning, agent på hjemmeside, AI agent link
updated: 2026-09-06
---
Agenten har to ansigter. På hjemmesiden er det et vindue i hjørnet, der åbnes med en knap. På sociale medier og i chatbeskeder er det en side via et kort link, der fungerer som en lille butik og kan installeres på telefonen som en app. Katalog, betingelser, dialoger og forespørgsler er dog fælles: agenten er den samme.

Alt, hvad der er beskrevet nedenfor, findes under “Widget og link”.

## Link til agenten

En kort adresse af typen `comag.vibevox.pro/c/your-shop`. Placeres i profilens bio på Instagram, TikTok eller Telegram, sendes i WhatsApp, lægges i beskrivelsen under en YouTube-video.

Når linket sendes i en chatbesked, udfoldes det til et kort: forsidebillede, butiksnavn og beskrivelse. Alle tre felter kan tilpasses:

- **Preview-overskrift** — som standard butikkens navn.
- **Preview-beskrivelse** — en kort sætning om, hvad man kan spørge om.
- **Forsidebillede** — genereres automatisk ud fra din accentfarve, dit logo og produktbilleder. Du kan uploade dit eget, størrelse 1200 gange 630 pixels.

Den nemmeste måde at tjekke, hvordan previewet ser ud, er ved at sende linket til dig selv i Telegram.

## Kode til hjemmesiden

Én linje, der indsættes før den afsluttende `</body>`-tag på alle sider. Kopieres med en knap i kontrolpanelet.

Hvor det præcist indsættes på populære platforme:

| Platform | Hvor det indsættes |
| --- | --- |
| Tilda | “Websiteindstillinger” → “Mere” → “HTML-kode til body” |
| Shopify | “Tema” → “Rediger kode” → `theme.liquid`, før `</body>` |
| WordPress | “Udseende” → “Temaeditor” → `footer.php`, eller et plugin til kodeindsættelse |
| Wix | “Indstillinger” → “Brugerdefineret kode” → tilføj i Body end |
| Din egen hjemmeside | Direkte i skabelonen før `</body>` |

Efter indsættelsen vises en knap i nederste højre hjørne. Positionen kan ændres til venstre i indstillingerne, farve og tema — samme sted.

> [!tip] Widgetten indlæses asynkront og forsinker ikke siden. Hvis du har en streng CSP indstillet, skal du tillade domænet `comag.vibevox.pro` i `script-src` og `connect-src`.

## Udseende

Indstillinger, som kunden ser:

- **Butiksnavn og assistentens navn.** Det andet er samtalepartnerens signatur i chattoverskriften.
- **Velkomstbesked.** Den første sætning. En god velkomstbesked lover fordele, i stedet for blot at hilse.
- **Forslag i starten af dialogen.** Op til fire knapper med spørgsmål. Tomt — genereres automatisk ud fra kataloget.
- **Kommunikationstone.** Fra en liste eller din egen: “varm og kortfattet”, “ekspert, formel”.
- **Accentfarve.** Én farve definerer knappen, links og fremhævelse af kort.
- **Logo.** Det bliver også app-ikonet på telefonen.
- **Mikrofonknap.** Talegenkendelse i browseren. Hvis browseren ikke understøtter det, optager kunden en talebesked, og Gemini transskriberer den.

Til højre er der en live-forhåndsvisning: den ændrer sig, mens du skriver. Knappen “Gem” overfører ændringerne til hjemmesiden.

## Lys og mørk tema

Chatten har to designs, og de skiftes i ét indstillingsfelt — “Tema”.

| Værdi | Hvad kunden ser |
| --- | --- |
| “Som hos besøgende” | Temaet tilpasser sig indstillingerne på kundens telefon eller computer: mørkt om natten, lyst om dagen |
| “Lys” | Altid et lyst vindue, uanset enhed |
| “Mørk” | Altid et mørkt vindue |

Som standard er “Som hos besøgende” valgt, og i de fleste tilfælde er dette det rigtige valg: en person med et mørkt tema på telefonen får ikke et hvidt blitz i ansigtet, og den, der er vant til et lyst tema, vil se et velkendt vindue.

Et fast tema er nødvendigt, når hjemmesiden selv er designet i én stil. En mørk landingsside med en lys chat i hjørnet ligner en lappeløsning, og omvendt. I så fald skal du indstille det samme tema som hjemmesiden, og widgetten vil smelte sammen med designet.

Accentfarven fungerer oven på begge temaer: knapper, links og fremhævelse af kort får din firmakleur, mens baggrund og tekst ændrer sig med temaet. Den nemmeste måde at tjekke begge varianter på er i forhåndsvisningen til højre — den opdateres med det samme, mens du skifter værdi.

## Produktkort fører til din hjemmeside

Agenten svarer ikke med en sammenhængende tekst, men med kort: fotografi, navn, pris, knap. Bag knappen er der altid en adresse — produktsiden på din hjemmeside eller det originale opslag på sociale medier, hvis kortet er samlet derfra.

Inde i widgetten på hjemmesiden sker overgangen i samme vindue for at undgå at oprette for mange faner. På agentsiden via linket åbnes kortet i en ny fane, så dialogen ikke går tabt.

For butikker på Shopify og WooCommerce er der en fin detalje: knappen åbner ikke kun produktet, men lægger det også i butikkens indkøbskurv via platformens standardmekanisme. Detaljer findes i artiklerne om [Shopify](/wiki/da/platform-shopify) og [WordPress](/wiki/da/platform-wordpress).

Og desuden: widgetten læser produktets markup på den side, hvor den er åben, og sender den til agenten. Derfor forstås spørgsmålet “findes den i blå?” på produktkortet i kontekst, uden yderligere præcisering af, hvad det handler om.

## App på kundens telefon

Agentsiden kan installeres som en app. Kunden åbner linket fra telefonen, ser et forslag om at tilføje til startskærmen og får et ikon med dit logo.

- **Navn under ikon** — ét ord på op til 12 tegn. Tomt — vi bruger det første ord i butikkens navn.
- **Ikon** — det uploadede logo. Hvis der ikke er et logo, bruges Commerce Agents' logo.
- På iPhone sker installationen via “Del” → “Føj til hjemmeskærm”, dette er en begrænsning i Safari, og agenten guider selv gennem trinene.

Efter installationen kan kunden modtage push-notifikationer fra sektionen “Dialoger”. Tilladelse til dette giver kunden selv ved at trykke på klokkeikonet i chattoverskriften.

## Vedhæftninger fra kunden

I chatten er der en papirclips: foto, video eller lyd på op til 20 megabyte. Hvis browseren ikke har talegenkendelse, optager et langt tryk på mikrofonen en talebesked.

Gemini analyserer filen: hvad der vises, hvilken tekst der er på billedet, hvad der siges højt. Agenten svarer ud fra denne analyse, og du ser både filen og en kort beskrivelse i dialogen. Dette er nyttigt i nicher, hvor det er nemmere at vise end at beskrive: reservedele, reparation, valg ud fra foto.

## Købspixel til hjemmeside med indkøbskurv

Hvis betalingen sker på din hjemmeside og ikke i chatten, skal du indsætte et kort fragment fra kontrolpanelet på siden “Tak for din ordre”, og indsætte ordrenummer og beløb. Købet vil blive knyttet til dialogen, og i statistikken vil det være synligt, hvilke samtaler der ender med et salg.

## Tjek

Tre minutter, der er værd at bruge efter opsætningen:

1. Åbn hjemmesiden i inkognitotilstand, og klik på widget-knappen. Stil et spørgsmål om et produkt.
2. Åbn linket til agenten fra din telefon. Tjek, at installation tilbydes.
3. Send linket til dig selv i en messenger, og se forhåndsvisningen.
4. Kig ind i “Dialoger”: Begge samtaler bør dukke op der.

## Ofte stillede spørgsmål

### Er widgetten på hjemmesiden og linket forskellige agenter?

Det er den samme. Katalog, betingelser, dialoger og henvendelser er fælles. Kun designet er anderledes: på hjemmesiden er det et vindue i hjørnet, via linket er det en fuldskærmsside, som kan installeres på telefonen.

### Kan linkadressen ændres?

Adressen dannes ud fra butikkens navn, når du opretter butiksfacaden. Hvis du ønsker en anden, så skriv til os på Telegram – vi ændrer den manuelt for at undgå at ødelægge allerede delte links.

### Vil widgetten gøre hjemmesiden langsommere?

Nej. Scriptet fylder lidt og indlæses asynkront efter sidens hovedindhold. Selve chatvinduet indlæses først, når kunden klikker på knappen.

### Hvad ser kunden, hvis agenten er slået fra?

Intet: knappen vises ikke, og siden via linket viser, at agenten er utilgængelig. Afbryderen findes under “Widget og link”.

### Hvordan fjerner man teksten “Drevet af Commerce Agents”?

Ikke endnu: teksten forbliver på alle abonnementer. Den er klikbar og fører til vores hjemmeside – det er en del af prisen, som gør, at servicen koster 29 € i stedet for et markant højere beløb.