Prilagodba widgeta
Učinite da chat widget odgovara Vašem brendu i ponaša se točno onako kako želite. Sva prilagodba događa se u Vašem kontrolnom panelu — promjene se automatski primjenjuju na Vašu web-stranicu, bez diranja embed koda.
Postavke ćete pronaći u Dashboard → Chatbots → odaberite svoj chatbot:
- Kartica Widget kontrolira izgled (pozicija, boje, veličina, tekstovi)
- Kartica Behavior kontrolira kako widget komunicira s posjetiteljima
Kliknite Save Changes pri vrhu stranice kako biste primijenili svoje izmjene.
Kartica Widget: Izgled
Pozicija
Odaberite gdje se widget pojavljuje na Vašoj web-stranici:
| Position | Description |
|---|---|
| Bottom Right | Plutajuća chat balončić u donjem desnom kutu (zadano) |
| Bottom Left | Plutajuća chat balončić u donjem lijevom kutu |
| Inline (Embedded) | Widget je ugrađen izravno na stranicu umjesto da pluta |
S Inline pozicijom, chat je ugrađen na mjesto gdje je postavljen embed skripta i uvijek je otvoren — nema balončića, nema gumba za zatvaranje. Idealno za posvećene stranice za chat ili podršku. Pogledajte Widget Embedding za detalje.
Tematske boje
Odaberite jedan od tri predloška boja:
| Preset | Description |
|---|---|
| Default | Standardna ChatReact shema boja |
| Brand | Boje Vaše tvrtke iz Company Settings |
| Custom | Odaberite vlastite boje |
Predložak Brand dostupan je tek nakon što su postavljene boje brenda. Idite u Company Settings kako biste izdvojili boje s Vaše web-stranice.
Ako odaberete Custom, možete postaviti četiri osnovne boje:
- Primary — balončić, gradijent zaglavlja, gumbi i poruke posjetitelja
- Secondary — druga boja gradijenta zaglavlja
- Background — pozadina prozora chata
- Text — boja teksta poruka
Napredne postavke boja
Treba Vam veća kontrola? Kad je odabran predložak Custom, proširite Advanced Color Settings kako biste prebrisali automatski izračunate boje:
- Visitor Messages — pozadina i boja teksta balončića poruka posjetitelja
- Bot Messages — pozadina i boja teksta balončića poruka bota
- Header Text Color — boja naslova i podnaslova u zaglavlju widgeta
Sve što ostavite netaknutim izračunava se automatski radi dobrog kontrasta. Svako prepisivanje ima gumb Reset to automatic za povratak na izračunatu boju.
Veličina i stil
| Setting | Range | Default |
|---|---|---|
| Border Radius | 0–32 px | 24 px |
| Width | 300–500 px | 380 px |
| Height | 400–700 px | 600 px |
Na malim mobilnim zaslonima widget se automatski prebacuje na izgled punog širine, bez obzira na ove dimenzije.
Logo
Omogućite Use company logo in widget header kako biste prikazali logo svoje tvrtke u zaglavlju chata. Sam logo se učitava u Company Settings — preporučeno: kvadratno, najmanje 200×200 px (JPG, PNG, GIF, WebP ili SVG, max. 5 MB).
Ova opcija dostupna je na planu Professional i iznad, te na svim Agency planovima.
Naslov zaglavlja, podnaslov i tekst balončića
| Field | Description | Default |
|---|---|---|
| Header Title | Naslov prikazan u zaglavlju prozora chata | "Chat with us" |
| Header Subtitle | Manji redak ispod naslova | "We typically reply within minutes" |
| Bubble Text | Tekst prikazan pored chat balončića kada je widget zatvoren | None |
Ako nikada ne postavite naslov ili podnaslov, widget prikazuje zadani tekst — automatski lokaliziran na jezik svakog posjetitelja.
Kako radi podnaslov zaglavlja: Dok ne konfigurirate podnaslov, widget prikazuje lokalizirani zadani tekst, a obrazac postavki unaprijed popunjava taj zadani tekst kako biste vidjeli i uredili što posjetitelji dobivaju. Za potpuno sakrivanje podnaslova, očistite polje i spremite — namjerno ispraznjen podnaslov ostaje skriven.
Tekst balončića pojavljuje se kao mala oznaka pored zatvorenog chat balončića (npr. "Imate pitanja?"). Ostavite prazno da se prikaže samo okrugli balončić.
Prijevodi widgeta
Ako Vaš chatbot podržava više jezika, ispod postavki izgleda pojavljuje se kartica Widget Translations. Tamo možete prevesti poruku dobrodošlice, fallback poruku, naslov zaglavlja, podnaslov zaglavlja i tekst balončića za svaki omogućeni jezik.
Poruke dobrodošlice i fallback poruke konfiguriraju se u kartici Persona u postavkama Vašeg chatbota.
Live Preview
Desni stupac kartice Widget prikazuje Live Preview Vašeg widgeta koji se ažurira dok mijenjate postavke. Interaktivan je: zatvorite prozor chata s X kako biste vidjeli zatvoreni balončić (uključujući Vaš tekst balončića), i kliknite balončić da ga ponovno otvorite.
Kartica Behavior: Interakcija
Postavke ponašanja
| Setting | Description | Default |
|---|---|---|
| Proactive Greeting | Bot automatski pozdravlja posjetitelje nakon odgode (1–10 sekundi) | On, 3 s |
| Auto-Open | Widget se automatski otvara za posjetitelje nakon odgode (1–15 sekundi) | Off, 5 s |
| Sound Enabled | Reproduciraj zvukove za obavijesti | On |
| Typing Indicator | Prikaži animaciju dok bot tipka | On |
| Pre-Chat Form | Prikupite podatke posjetitelja prije početka chata | Off |
| Show on Mobile | Prikaži widget na mobilnim uređajima | On |
Maksimalna duljina poruke
Ograničite koliko znakova posjetitelji mogu unijeti po poruci (100–10.000 znakova, zadano 2.000). To pomaže spriječiti pretjerano korištenje vrlo dugim unosima. Očistite polje ili kliknite Remove limit kako biste dozvolili poruke bilo koje duljine.
Pre-Chat obrazac
Kada je pre-chat obrazac omogućen, posjetitelji ispunjavaju kratak obrazac prije nego što razgovor započne. Polja konfigurirate sami:
- Vrste polja: Text, Email, Phone, Textarea
- Svako polje ima label, opcionalni placeholder i prekidač required
- Pomičite polja gore/dolje s gumbima za premještanje ili ih uklonite
Ako Vaš chatbot podržava više jezika, ispod uređivača polja pojavljuje se odjeljak za prijevode. Unesite prijevode za svaki jezik ručno ili kliknite Translate with AI kako biste automatski preveli sve oznake i placeholder-e.
Live Chat
Kartica Behavior također sadrži karticu Live Chat Settings. Omogućite live chat kako biste posjetiteljima omogućili razgovor s Vašim ljudskim agentima i odaberite način rada:
| Mode | Description |
|---|---|
| Handoff Only | Live chat je dostupan samo kad bot ne može pomoći |
| Standalone | Posjetitelji mogu izravno razgovarati s agentima |
| Both | Dostupni su i handoff i izravni live chat |
Live Chat dostupan je na planu Professional i iznad, te na svim Agency planovima. Pogledajte Live Chat za upravljanje dolaznim razgovorima.
Branding
Na planovima koji uključuju white-label, pri dnu kartice Behavior pojavljuje se kartica Branding. ChatReact brendiranje je po zadanim postavkama skriveno na tim planovima — omogućite Show "Powered by ChatReact" ako želite da se ipak prikazuje u podnožju widgeta.
Faza učenja
Dok je novi chatbot u fazi učenja, možete kontrolirati koliko oprezno odgovara — Cautious, Balanced (preporučeno) ili Confident — u kartici Confidence iste stranice postavki. Ova kartica pojavljuje se na planovima koji uključuju Improvement Agent. Pogledajte vodič Improvement Agent za detalje.