Widget na web-stranici, poveznica na agenta i aplikacija na telefonu
Kako postaviti agenta na web-stranicu u jednom retku, kako funkcionira kratka poveznica za društvene mreže i aplikacije za razmjenu poruka te kako kupac instalira vašeg agenta na telefon kao aplikaciju.
Agent ima dva lica. Na web-mjestu to je prozor u kutu koji se otvara pritiskom na gumb. Na društvenim mrežama i u aplikacijama za dopisivanje – to je stranica s kratkom poveznicom koja funkcionira kao mala trgovina i može se instalirati na telefon kao aplikacija. Katalog, uvjeti, razgovori i prijave pritom su zajednički: agent je jedan.
Sve opisano u nastavku nalazi se u odjeljku „Widget i poveznica“.
Poveznica na agenta#
Kratka adresa poput comag.vibevox.pro/c/your-shop. Postavlja se u zaglavlje profila Instagram, TikTok ili Telegram, šalje se u WhatsApp, stavlja se u opis ispod videozapisa na YouTubeu.
Prilikom slanja u aplikaciju za dopisivanje, poveznica se pretvara u karticu: naslovna slika, naziv trgovine i opis. Sva tri polja mogu se prilagoditi:
- Naslov pretpregleda — prema zadanim postavkama, naziv trgovine.
- Opis pretpregleda — kratka fraza o tome što se može pitati.
- Naslovna slika — automatski se generira iz vaše naglašene boje, logotipa i fotografija proizvoda. Možete učitati vlastitu, veličine 1200 x 630 piksela.
Najlakši način da provjerite kako izgleda pretpregled je da pošaljete poveznicu sami sebi u Telegram.
Kod za web-mjesto#
Jedan redak koji se umeće prije završne oznake </body> na svim stranicama. Kopira se gumbom u administraciji.
Gdje točno umetnuti na popularnim platformama:
| Platforma | Gdje umetnuti |
|---|---|
| Tilda | Postavke web-mjesta → Više → HTML kod za body |
| Shopify | Tema → Uredi kod → theme.liquid, prije </body> |
| WordPress | Izgled → Uređivač teme → footer.php, ili dodatak za umetanje koda |
| Wix | Postavke → Prilagođeni kod → dodaj u Body end |
| Vlastito web-mjesto | Izravno u predložak prije </body> |
Nakon umetanja, u donjem desnom kutu pojavit će se gumb. Položaj se može promijeniti u lijevi u postavkama, boja i tema – također tamo.
Widget se učitava asinkrono i ne usporava stranicu. Ako imate konfiguriran strogi CSP, dopustite domenu comag.vibevox.pro u script-src i connect-src.
Izgled#
Postavke koje kupac vidi:
- Naziv trgovine i ime asistenta. Drugo je potpis sugovornika u zaglavlju chata.
- Pozdrav. Prva rečenica. Dobar pozdrav obećava korist, a ne samo pozdravlja.
- Savjeti na početku razgovora. Do četiri gumba s pitanjima. Prazno – automatski će se prikupiti prema katalogu.
- Ton komunikacije. S popisa ili vlastiti: „topao i kratak“, „stručan, formalan“.
- Naglašena boja. Jedna boja definira gumb, poveznice i isticanje kartica.
- Logotip. On će postati i ikona aplikacije na telefonu.
- Gumb mikrofona. Prepoznavanje govora u pregledniku. Ako preglednik to ne podržava, kupac će snimiti glasovnu poruku, a Gemini će je transkribirati.
Desno je pretpregled uživo: mijenja se dok tipkate. Gumb „Spremi“ prenosi promjene na web-mjesto.
Svijetla i tamna tema#
Chat ima dva izgleda, a prebacuju se u jednom polju postavki – „Tema“.
| Vrijednost | Što kupac vidi |
|---|---|
| Kao kod posjetitelja | Tema se prilagođava postavkama njegovog telefona ili računala: noću tamna, danju svijetla |
| Svijetla | Uvijek svijetli prozor, bez obzira na uređaj |
| Tamna | Uvijek tamni prozor |
Prema zadanim postavkama postavljeno je „Kao kod posjetitelja“, i u većini slučajeva to je pravi izbor: osoba s tamnom temom na telefonu neće dobiti bijeli bljesak u lice, a onaj tko je navikao na svijetlu, vidjet će poznati prozor.
Fiksna tema potrebna je kada je samo web-mjesto izrađeno u jednom stilu. Tamna odredišna stranica sa svijetlim chatom u kutu izgleda kao zakrpa, i obrnuto. U tom slučaju postavite istu temu kao i web-mjesto, i widget će se stopiti s dizajnom.
Naglašena boja funkcionira preko obje teme: gumbi, poveznice i isticanje kartica preuzimaju vašu korporativnu boju, dok se pozadina i tekst mijenjaju zajedno s temom. Najlakše je provjeriti obje varijante u pretpregledu s desne strane – on se odmah ponovno iscrtava dok prebacujete vrijednost.
Kartice proizvoda vode na vaše web-mjesto#
Agent ne odgovara neprekinutim tekstom, već karticama: fotografija, naziv, cijena, gumb. Iza gumba uvijek stoji adresa – stranica proizvoda na vašem web-mjestu ili izvorni post na društvenoj mreži, ako je kartica prikupljena od tamo.
Unutar widgeta na web-mjestu prijelaz se događa u istom prozoru, kako se ne bi stvarali novi tabovi. Na stranici agenta putem poveznice kartica se otvara u novom tabu, kako se razgovor ne bi izgubio.
Za trgovine na Shopify i WooCommerce postoji ugodan detalj: gumb ne samo da otvara proizvod, već ga i stavlja u košaricu trgovine standardnim mehanizmom platforme. Detalji su u člancima o Shopify i WordPress.
I još: widget čita oznake proizvoda na stranici gdje je otvoren i prosljeđuje ih agentu. Stoga se pitanje „a ima li u plavoj boji?“ na kartici proizvoda razumije u kontekstu, bez potrebe za dodatnim pojašnjenjem o čemu se radi.
Aplikacija na telefonu kupca#
Stranica agenta može se instalirati kao aplikacija. Kupac otvara poveznicu s telefona, vidi ponudu za dodavanje na početni zaslon i dobiva ikonu s vašim logotipom.
- Ime ispod ikone — jedna riječ do 12 znakova. Prazno – uzet ćemo prvu riječ naziva trgovine.
- Ikona — učitani logotip. Ako logotipa nema, koristi se logotip Commerce Agents.
- Na iPhoneu instalacija ide putem „Podijeli“ → „Na početni zaslon“, to je ograničenje Safarija, a agent sam nudi korake.
Nakon instalacije, kupcu se mogu slati push-obavijesti iz odjeljka „Razgovori“. Dopuštenje za njih daje sam, pritiskom na zvonce u zaglavlju chata.
Prilozi od kupca#
U chatu postoji spajalica: fotografija, video ili audio do 20 megabajta. Ako preglednik nema prepoznavanje govora, držanje mikrofona snima glasovnu poruku.
Datoteku analizira Gemini: što je prikazano, koji je tekst na slici, što je rečeno naglas. Agent odgovara na temelju te analize, a vi u razgovoru vidite i samu datoteku i kratak opis. To pomaže u nišama gdje je lakše pokazati nego opisati: rezervni dijelovi, popravci, odabir prema fotografiji.
Piksel kupnje za web-mjesto s košaricom#
Ako se plaćanje odvija na vašem web-mjestu, a ne u chatu, umetnite na stranicu „Hvala na narudžbi“ kratak isječak iz administracije, unoseći broj narudžbe i iznos. Kupnja će se povezati s razgovorom, i u statistici će biti vidljivo koji razgovori završavaju prodajom.
Provjera#
Tri minute koje vrijedi uložiti nakon postavljanja:
- Otvorite web-stranicu u anonimnom načinu rada i kliknite gumb widgeta. Postavite pitanje o proizvodu.
- Otvorite poveznicu na agenta s telefona. Provjerite nudi li se instalacija.
- Pošaljite poveznicu sebi u aplikaciju za razmjenu poruka i pogledajte pretpregled.
- Pogledajte u „Dijalozi“: tamo bi se trebale pojaviti obje prepiske.
Česta pitanja#
Widget na web-stranici i poveznica – jesu li to različiti agenti#
Jedan te isti. Katalog, uvjeti, dijalozi i zahtjevi su zajednički. Razlikuje se samo izgled: na web-stranici je prozor u kutu, a putem poveznice – stranica preko cijelog zaslona koju možete instalirati na telefon.
Može li se promijeniti adresa poveznice#
Adresa se formira od naziva trgovine prilikom izrade izloga. Ako vam treba drugačija, pišite nam na Telegram – promijenit ćemo je ručno kako ne bismo pokvarili već postavljene poveznice.
Hoće li widget usporiti web-stranicu#
Ne. Skripta je male težine i učitava se asinkrono, nakon glavnog sadržaja stranice. Sam prozor za chat učitava se tek kada kupac klikne gumb.
Što kupac vidi ako je agent isključen#
Ništa: gumb se ne pojavljuje, a stranica putem poveznice pokazuje da agent nije dostupan. Prekidač se nalazi u odjeljku „Widget i poveznica“.
Kako ukloniti natpis „Pokreće Commerce Agents“#
Zasad nikako: potpis ostaje na svim tarifama. On je klikabilan i vodi na našu web-stranicu – to je dio cijene, zahvaljujući čemu usluga košta 29 € umjesto znatno većeg iznosa.