Preskoči na sadržaj

Uputstva

Ugradnja dugmeta na sajt

Glasovni agent se na sajt dodaje jednom linijom koda. Ne menja dizajn sajta, ne usporava učitavanje i radi na telefonu.

Brzi početak

  1. Napravite nalog i u panelu podesite agenta, bazu znanja i kalendar.
  2. U panelu otvorite Dugme i ugradnja i kopirajte kod. U njemu je već vaš slug (umesto vas-slug).
  3. Nalepite kod na sajt, odmah iznad </body>, ili po uputstvu za vašu platformu ispod.
  4. U panelu dodajte adresu sajta u dozvoljene domene.
html
<script src="https://govor.ai/widget.js" data-workspace="vas-slug" defer></script>

Stari atribut data-tenant i dalje radi, isto kao data-workspace.

Uputstva po platformi

Korak po korak, sa tačnim mestom gde se kod lepi:

Dozvoljeni domeni

Dugme radi samo na sajtovima koje ste dozvolili, da niko ne bi mogao da troši vaše minute sa tuđeg sajta. U panelu otvorite Dugme i ugradnja, deo o dozvoljenim domenima, i upišite punu adresu sa protokolom:

  • https://vasa-firma.rs i https://www.vasa-firma.rs su dve različite adrese - dodajte obe ako sajt radi na obe.
  • Bez putanje i kose crte na kraju: https://vasa-firma.rs, ne https://vasa-firma.rs/kontakt/.
  • Za probu na svom računaru dodajte i http://localhost:3000 (ili port koji koristite).
  • Broj domena zavisi od paketa (Start 1, Pro 3, Biznis 10).

Izgled i kontrola

Boju, tekst, položaj, oblik i veličinu dugmeta podešavate u panelu (Dugme i ugradnja), uz pregled uživo. Najvažnije stvari možete zadati i direktno u kodu, atributima:

AtributZnačenje
data-workspaceVaš slug (obavezno). Staro ime: data-tenant.
data-langJezik razgovora: sr, en, de, ru… Podrazumevano jezik strane (<html lang>).
data-labelTekst na dugmetu.
data-colorBoja dugmeta, npr. #0ea47a.
data-positionright (podrazumevano) ili left.
html
<script
  src="https://govor.ai/widget.js"
  data-workspace="vas-slug"
  data-lang="en"
  data-label="Talk to us"
  data-color="#0ea47a"
  data-position="left"
  defer
></script>

Otvaranje iz sopstvenog dugmeta

Widget pravi objekat window.govor sa funkcijama start() i stop(). Tako razgovor možete pokrenuti iz bilo kog dugmeta ili linka na sajtu, npr. u zaglavlju ili na strani proizvoda.

html
<!-- Sopstveno dugme ili link koji otvara razgovor -->
<button type="button" onclick="window.govor && window.govor.start()">
  Pozovite nas glasom
</button>

<script>
  // Završi razgovor iz koda (npr. kad posetilac ode na plaćanje)
  window.govor && window.govor.stop();
</script>

Višejezični sajt: ako strana ima ispravan <html lang="en">, agent sam počinje na tom jeziku (ako je jezik uključen u panelu).

Lična strana

Svaka firma dobija svoju stranu sa agentom, na adresi https://govor.ai/a/vas-slug. Link nađete u panelu. Strana se ne pojavljuje u Google pretrazi (označena je sa noindex), ali je svako sa linkom može otvoriti.

  • Pošaljite link klijentima mejlom ili porukom, stavite ga u Instagram bio ili potpis mejla.
  • Korisno i pre nego što agenta postavite na sajt - da ga isprobate vi i vaš tim.
  • Stranu možete isključiti u panelu.

Rešavanje problema

Dugme se ne vidi

  • Proverite da je kod na strani: desni klik → View page source i potražite widget.js.
  • Obrišite keš sajta (WordPress dodaci za keš, Cloudflare) i osvežite stranu.
  • Dodaci za optimizaciju koji odlažu JavaScript mogu odložiti dugme do prvog pomeranja strane - izuzmite widget.js.
  • Wix, Webflow i Squarespace prikazuju prilagođeni kod samo na objavljenom sajtu, ne u editoru.
  • U konzoli pregledača (F12 → Console) poruka [govor.ai] nedostaje data-workspace znači da u kodu nema sluga.

Greška „origin“ ili „agent trenutno nije dostupan“

  • origin (403): adresa sajta nije u dozvoljenim domenima. Uporedite tačno: www, https i port.
  • Agent trenutno nije dostupan (402): potrošeni su minuti ili je istekla proba ili paket. Pogledajte stanje u panelu.
  • Previše razgovora (429): zaštita od zloupotrebe, ista adresa je pokrenula previše razgovora. Sačekajte pola sata.

Mikrofon je blokiran

  • Kliknite ikonicu katanca pored adrese sajta → Mikrofon → Dozvoli, pa osvežite stranu.
  • Na telefonu proverite i da pregledač u podešavanjima telefona ima dozvolu za mikrofon.
  • Ako je sajt u <iframe>, iframe mora imati allow="microphone".

HTTPS

Pregledači daju mikrofon samo sajtovima na https:// (izuzetak je localhost). Na sajtu sa http:// dugme se vidi, ali razgovor ne može da počne. Većina hosting firmi besplatno uključuje SSL (Let's Encrypt).

API za sopstveni UI

Ako ne želite naše dugme, razgovor možete otvoriti iz svog koda. Zahtev ide sa vašeg dozvoljenog domena (ili sa servera), a odgovor sadrži LiveKit token za sobu u kojoj agent čeka.

http
POST https://govor.ai/v1/sessions
Content-Type: application/json

{ "workspace": "vas-slug", "lang": "sr" }
json
200 OK
{
  "serverUrl": "wss://….livekit.cloud",
  "token": "eyJhbGciOi…",
  "roomName": "vas-slug-6f1c…",
  "identity": "visitor-…",
  "lang": "sr"
}

Telo: workspace (vaš slug; prihvata se i staro tenant), lang (opciono). Greške: 400 bad_request, 404 unknown_workspace, 403 origin, 429 rate, 402 unavailable (sa reason: no_minutes, inactive, trial_expired, busy), 503 not_configured.

Povezivanje (livekit-client)

Za razgovor koristite livekit-client. Agent pita za mejl preko RPC metoda govor.requestEmail: ako ga registrujete, posetilac upisuje mejl u vaše polje; ako ne, agent ga traži glasom i proverava slovo po slovo.

ts
import { Room, RoomEvent, Track } from 'livekit-client';

const res = await fetch('https://govor.ai/v1/sessions', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ workspace: 'vas-slug', lang: 'sr' }),
});
if (!res.ok) throw new Error((await res.json()).error); // origin, rate, unavailable…
const { serverUrl, token } = await res.json();

const room = new Room();

// Glas agenta
room.on(RoomEvent.TrackSubscribed, (track) => {
  if (track.kind === Track.Kind.Audio) document.body.appendChild(track.attach());
});

// Stanje agenta: listening | thinking | speaking
room.on(RoomEvent.ParticipantAttributesChanged, (_changed, p) => {
  console.log('agent:', p.attributes['lk.agent.state']);
});

// Transkript uživo
room.registerTextStreamHandler('lk.transcription', async (reader, participant) => {
  const text = await reader.readAll();
  console.log(participant.identity, text);
});

// Polje za mejl: agent ga traži pre zakazivanja (60 s)
room.registerRpcMethod('govor.requestEmail', async ({ payload }) => {
  const { lang } = JSON.parse(payload);
  const email = await askVisitorForEmail(lang); // vaš UI; null ako odustane
  return JSON.stringify(email ? { email } : { cancelled: true });
});

await room.connect(serverUrl, token);
await room.localParticipant.setMicrophoneEnabled(true);

Pitanje ili problem koji ovde nije opisan? Pišite nam iz panela ili odgovorite na bilo koji naš mejl.