„ChatLab“ pridėjimas prie svetainės leidžia lankytojams bendrauti su Jūsų dirbtinio intelekto pokalbių robotu tiesiogiai Jūsų svetainėje. Šiame vedlyje paaiškinama, kaip gauti įterpimo kodą ir pridėti jį prie savo svetainės.
Prieš pradedant
Sukurkite ir apmokykite savo pokalbių robotą prieš pateikdami jį klientams. Norint atlikti diegimą, Jums taip pat reikės prieigos teisių redaguoti ir publikuoti svetainę. Žr. Kaip sukurti savo pirmąjį pokalbių robotą.
Skirtuko „Deploy“ atidarymas
Pagrindiniame valdymo skydelyje pasirinkite savo pokalbių robotą ir spustelėkite skirtuką Deploy (diegti).
Platformos pasirinkimas
Dešinėje esančiame skydelyje Select Platform (pasirinkti platformą) palaikomos paskirties vietos suskirstytos į dvi grupes: Website (svetainė) - skirta patalpinti pokalbių robotą Jūsų valdomuose puslapiuose, ir Messaging channels (pranešimų kanalai) - skirta prijungti jį prie esamos pokalbių paskyros. Spustelėkite įrašą, atitinkantį vietą, kurioje norite, kad atsirastų pokalbių robotas, ir pamatysite pritaikytas instrukcijas.
Palaikomos platformos:
- HTML Code - veikia bet kurioje svetainėje, kurioje galite redaguoti HTML
- WordPress - per oficialų „ChatLab“ įskiepį arba rankiniu būdu įterpiant kodą
- Wix - per Settings > Custom Code
- Webflow - per Site settings > Custom code, jei Jūsų svetainei ar darbo erdvei įjungta prieiga prie pasirinktinio kodo
- PrestaShop - per „ChatLab PrestaShop“ modulį arba rankiniu būdu įterpiant kodą
- Shopify - per failą theme.liquid
- WooCommerce - per „WordPress“ įskiepį arba rankiniu būdu įterpiant kodą
- Abicart - per Store design > Themes > Site header
- CS-Cart - per Design > Layouts > Custom HTML code
Pranešimų kanalai:
- WhatsApp Business - atsako „WhatsApp Business“ paskyroje, žr. WhatsApp for Business
- Facebook Messenger - atsako į Jūsų „Facebook“ puslapio pranešimus, žr. Integracija su Facebook Messenger
- Instagram - atsako į tiesiogines „Instagram“ žinutes, žr. Integracija su Instagram
Pranešimų kanalams toliau pateiktas įterpimo kodas nenaudojamas. Jie prijungiami prie paskyros, kurią jau turite, todėl joks kodas į svetainę nėra įklijuojamas.
Kiekvienoje platformoje pateikiamos išsamios instrukcijos, būdingos būtent tai integracijai. Platformoms, kurios turi atskirus pagalbos straipsnius, apačioje rodoma nuoroda View full instructions (peržiūrėti visas instrukcijas).
Pridėjimas naudojant HTML Code
Parinktis „HTML Code“ veikia su bet kuria svetaine, kurioje turite prieigą prie pirminio kodo. Matysite dvi įterpimo parinktis: Widget (valdiklis) ir Iframe.
Režimas „Widget“
Skirtuke Widget rodomas kodas, kuris svetainėje prideda pokalbių piktogramą. Lankytojams spustelėjus piktogramą, atsidaro iškylantysis pokalbių langas.
- Spustelėkite skirtuką Widget
- Spustelėkite Copy to clipboard (kopijuoti į iškarpinę), kad nukopijuotumėte kodą
- Raskite savo svetainės skyrių
<head> - Įklijuokite kodą kaip paskutinį elementą skyriuje
<head> - Atnaujinkite naršyklės langą, kad įsitikintumėte, jog pokalbių roboto piktograma rodoma
Režimas „Iframe“
Skirtuke Iframe rodomas kodas, kuris įterpia pokalbių robotą tiesiai į Jūsų puslapio turinį. Pokalbių robotas yra matomas visada ir gali būti apsuptas kitų puslapio elementų.
- Spustelėkite skirtuką Iframe
- Spustelėkite Copy to clipboard, kad nukopijuotumėte kodą
- Įklijuokite kodą bet kurioje svetainės HTML vietoje, kurioje norite, kad atsirastų pokalbių robotas
- Koreguokite atributus
widthirheight, kad pritaikytumėte dydį prie puslapio išdėstymo
Nežinote, ką pasirinkti? Išsamų palyginimą skaitykite straipsnyje Kuo skiriasi widget ir Iframe?.
Pridėjimas per „WordPress“ arba „WooCommerce“
„WordPress“ ir „WooCommerce“ platformos siūlo du diegimo būdus: Plugin Installation (diegimas naudojant įskiepį, rekomenduojama) ir Manual Installation (rankinis diegimas).
Diegimas naudojant įskiepį (rekomenduojama)
- Spustelėkite Get the plugin on WordPress.org (gauti įskiepį iš WordPress.org), tada įdiekite ir suaktyvinkite „ChatLab“ įskiepį.
- „WordPress“ aplinkoje atidarykite ChatLab. Jei tai „WooCommerce“ parduotuvė, palikite pažymėtą parinktį WooCommerce integration (WooCommerce integracija), kad prijungtumėte ir parduotuvės duomenis.
- Spustelėkite Continue (tęsti), prisijunkite prie „ChatLab“ ir pasirinkite savo pokalbių robotą.
- Užbaikite prijungimą, atidarykite savo paskelbtą svetainę ir išsiųskite bandomąjį pranešimą.
Rankinis diegimas
Perjunkite į Manual Installation ir nukopijuokite Widget kodą į savo svetainės antraštę (header) naudodami kodo įterpimo įskiepį. Pasirinkę Iframe, naudokite puslapio turinio HTML bloką, leidžiantį naudoti „iframe“ HTML. Paskelbkite puslapį ir išbandykite pokalbį. Valdiklį įdiekite tik vieną kartą: arba naudodami įskiepį, arba rankiniu kodo fragmentu.
Išsamesnės informacijos rasite straipsnyje Kaip pridėti pokalbių robotą prie WordPress svetainės.
Pridėjimas per kitas platformas
Norėdami integruoti su „Shopify“, „Wix“, „Webflow“, „PrestaShop“, „Abicart“ ar „CS-Cart“, pasirinkite atitinkamą platformą skydelyje Select Platform. Kiekvienoje platformoje pateikiama:
- Įterpimo kodas su pasirinktimis Widget ir Iframe
- Nuoseklios kodo įklijavimo instrukcijos konkrečiai platformai
- Nuoroda View full instructions į išsamų platformos vadovą
BDAR (GDPR) atitiktis
Jei reikia, kad pokalbių robotas būtų įkeliamas tik gavus sutikimą dėl slapukų, žr. „ChatLab“ konfigūravimas BDAR atitikčiai, kur pateikiami integracijos vadovai, apimantys „CookieBot“, „Usercentrics“ ir „Google Tag Manager“.
Turinio saugumo politika (CSP)
Jei Jūsų svetainėje naudojamos turinio saugumo politikos (Content Security Policy) antraštės, turite leisti „ChatLab“ domenus, kad pokalbių robotas galėtų veikti. Reikalingos direktyvos priklauso nuo to, ar naudojate režimą „Widget“, ar „Iframe“.
Režimas „Widget“
Valdiklis Jūsų puslapyje įkelia scenarijų, kuris sukuria pokalbių sąsają. Sujunkite šiuos „ChatLab“ šaltinius su esamomis CSP direktyvomis; nepakeiskite visos likusios svetainės politikos:
script-src https://script.chatlab.com;
style-src https://script.chatlab.com https://fonts.googleapis.com 'unsafe-inline';
connect-src https://api.chatlab.com wss://api.chatlab.com;
font-src https://fonts.gstatic.com;
Pagal numatytuosius nustatymus valdiklis kai kuriuos stilius įterpia tiesiogiai kode (inline). Jūsų politika taip pat turi autorizuoti integruotą konfigūracijos scenarijų, pavyzdžiui, naudojant CSP „nonce“ arba maišą (hash). Direktyvoje img-src leiskite vaizdų šaltinius, kuriuos naudoja Jūsų robotas ir produktų kortelės; garso ir kitoms įjungtoms funkcijoms gali prireikti papildomų šaltinių. Jei naudojate agentūros domeną, nurodykite domenus iš sugeneruoto kodo fragmento.
„CSP Safe Mode“ - kaip išvengti „unsafe-inline“
Jei Jūsų svetainės saugumo politika neleidžia naudoti 'unsafe-inline' direktyvoje style-src, galite įjungti CSP Safe Mode (saugaus CSP režimas). Taip valdiklio konteinerio stilių lentelė bus įkeliama iš išorinio CSS failo. Tai neautorizuoja Jūsų integruoto konfigūracijos scenarijaus ir negarantuoja, kad kiekvienas pasirinktinis stilius bei įjungta funkcija atitiks Jūsų politiką.
Norėdami jį įjungti, prieš „ChatLab“ scenarijaus žymę pridėkite window.aichatbotCspSafe = true;:
<script>
window.aichatbotApiKey = "YOUR_API_KEY";
window.aichatbotCspSafe = true;
</script>
<script src="https://script.chatlab.com/aichatbot.js" defer></script>
Įjungę „CSP Safe Mode“, išbandykite stilių lentelės politiką be 'unsafe-inline'. Pradinis taškas:
script-src https://script.chatlab.com;
style-src https://script.chatlab.com https://fonts.googleapis.com;
connect-src https://api.chatlab.com wss://api.chatlab.com;
font-src https://fonts.gstatic.com;
Režimas „Iframe“
Pagrindinis puslapis turi leisti nukopijuotame „iframe“ URL esantį šaltinį. Įprastam „ChatLab“ prieglobai į esamą politiką pridėkite:
frame-src https://api.chatlab.com;