Kuidas lisada Asyntai tehisintellekti vestlusrobot Adobe Experience Manageri

Samm-sammuline juhend AEM-i veebisaitide jaoks

Platvorm:

1. samm: hankige oma manuskood

Esmalt minge oma Asyntai juhtpaneelile ja kerige alla jaotiseni "Manuskood". Kopeerige oma unikaalne manuskood, mis näeb välja selline:

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Märkus: Ülalolev kood on vaid näide. Peate kopeerima oma unikaalse manuskoodi oma juhtpaneelilt, kuna see sisaldab teie isiklikku vidina ID-d.

2. samm: lisage kood lehekomponendi abil (soovitatav)

Soovitatav meetod on lisada vestlusroboti kood oma AEM lehekomponendi päise jaotisesse kogu saidi hõlmavaks paigaldamiseks:

Logige sisse oma AEM Authori instantsi
Navigeerige CRXDE Lite juurde (tavaliselt aadressil http://teie-aem-instants:4502/crx/de)
Leidke oma lehekomponendi mall (tavaliselt /apps/teie-projekt/components/page all)
Leidke või looge fail head.html või headerlibs.html
Lisage oma Asyntai manuskood sellesse faili
Klõpsake ülemises menüüs "Salvesta kõik"
Replitseerige muudatused oma avaldamisinstantsi

Vihje: Koodi paigutamine faili head.html tagab, et vestlusrobot ilmub kõikidele seda malli kasutavatele lehtedele. See on puhtaim lähenemine kogu saidi hõlmavaks paigaldamiseks.

Alternatiivne meetod 1: klienditeegid (ClientLibs)

Struktureerituma lähenemise jaoks saate kasutada AEM-i klienditeekide süsteemi:

Looge uus klienditeegi kaust /apps/teie-projekt/clientlibs alla
Määrake sõlme tüübiks cq:clientLibraryFolder
Looge fail js.txt, mis loetleb teie JavaScripti failid
Lisage oma Asyntai manuskood selles kaustas olevasse JavaScripti faili
Lisage klienditeek oma lehekomponenti kasutades:

<sly data-sly-use.clientlib="/libs/granite/sightly/templates/clientlib.html"
     data-sly-call="${clientlib.js @ categories='your-category-name'}" />

Märkus: See meetod on soovitatav olemasoleva ClientLib struktuuriga projektide jaoks ja pakub suuremate rakenduste jaoks paremat organiseerimist.

Alternatiivne meetod 2: sildihaldus (Adobe Launch)

Kui kasutate Adobe Launchi (endine DTM) või muud sildihaldajat:

Logige sisse Adobe Experience Platform Launchi
Navigeerige oma atribuudi juurde
Minge Reeglite juurde ja looge uus reegel
Määrake sündmuseks "Page Bottom" või "DOM Ready"
Lisage toiming: Kohandatud kood
Kleepige oma Asyntai manuskood
Salvestage ja avaldage teek

Vihje: Adobe Launchi kasutamine on Adobe soovitatav lähenemine kolmanda osapoole skriptide lisamiseks. See pakub paremat kontrolli, testimisvõimalusi ja ei nõua koodi juurutamist.

Alternatiivne meetod 3: kogemusfragment

Paindliku, autorisõbraliku rakenduse jaoks:

Navigeerige AEM-is jaotisesse Kogemusfragmendid
Looge uus kogemusfragment
Lisage tekstikomponent või HTML-komponent
Lülituge HTML-lähtekoodi režiimi
Kleepige oma Asyntai manuskood
Lisage see kogemusfragment oma lehe malli jalusesse

Oluline: Veenduge, et teil on mallide ja komponentide muutmiseks õiged AEM-i õigused. AEM as a Cloud Service puhul võivad muudatused vajada CI/CD torustiku läbimist.

3. samm: kontrollige paigaldust

Pärast muudatuste juurutamist tühjendage brauseri vahemälu ja külastage oma veebisaiti. Peaksite nägema vestlusvidina nuppu alumises paremas nurgas. Klõpsake sellel, et veenduda, et see avaneb ja töötab korrektselt.

Ei näe vidinat? Kontrollige brauseri konsooli (F12) JavaScripti vigade suhtes. Veenduge, et kood juurutati õigesti teie avaldamisinstantsi. AEM as a Cloud Service puhul veenduge, et teie muudatused läbisid juurutustorustiku edukalt.