Asyntai AI -chatbotin lisääminen Squarespaceen

Vaiheittainen opas Squarespace-verkkosivustoille

Alusta:

Vaihe 1: Hanki upotuskoodisi

Siirry ensin Asyntai-hallintapaneeliin ja vieritä alas kohtaan "Embed Code". Kopioi yksilöllinen upotuskoodisi, joka näyttää tältä:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

Huomautus: Yllä oleva koodi on vain esimerkki. Sinun on kopioitava oma yksilöllinen upotuskoodisi Hallintapaneelistasi, sillä se sisältää henkilökohtaisen widget-tunnuksesi.

Vaihe 2: Lisää koodi Code Injectionin avulla

Jos sivustollasi on Squarespace Core-, Plus- tai Advanced-paketti (tai vanhempi Business- tai Commerce-paketti), voit lisätä chatbotin kaikille sivuille kerralla Code Injectionin avulla:

Kirjaudu Squarespace-tilillesi ja avaa sivustosi
Napsauta vasemmassa paneelissa Pages
Napsauta paneelin alaosassa Custom Code
Napsauta Code Injection
Vieritä alas Footer-osioon
Liitä Asyntai-upotuskoodisi Footer-tekstikenttään
Napsauta "Save"

Huomautus: Squarespace 7.0:ssa Code Injection löytyy kohdasta Pages → Website Tools.

Vinkki: Koodin lisääminen Footer-osioon sijoittaa sen juuri ennen sulkevaa </body>-tagia, mikä on suositeltu sijoitus chat-widgeteille eikä hidasta sivun latautumista.

Vaihtoehto: Koodilohkojen käyttö

Jos haluat lisätä chatbotin vain tietyille sivuille, voit käyttää koodilohkoja (Code Blocks). Koodilohko suorittaa JavaScriptiä vain Core-, Plus- tai Advanced-paketissa (tai vanhemmassa Business- tai Commerce-paketissa).

Avaa sivustosi Squarespace-editorissa
Siirry sivulle, jolle haluat lisätä chatbotin
Napsauta "Edit" sivulla
Vie hiiri osion päälle ja napsauta "+ Add Block"
Vieritä alas ja valitse "Code"
Napsauta kynäkuvaketta muokataksesi koodilohkoa
Liitä Asyntai-upotuskoodisi
Varmista, että lohkon Mode-valikon arvoksi on asetettu HTML
Napsauta lohkon ulkopuolelle sulkeaksesi editorin
Napsauta "Save"

Tärkeää: Kun käytät koodilohkoja, koodi on lisättävä jokaiselle sivulle, jolla haluat chatbotin näkyvän. Jos haluat asentaa sen koko sivustolle, käytä yllä kuvattua Code Injection -menetelmää.

Vaihe 3: Vahvista asennus

Kun olet tallentanut muutoksesi, avaa verkkosivustosi uudessa selaimen välilehdessä tai incognito-ikkunassa. Chat-widgetin painikkeen pitäisi näkyä oikeassa alakulmassa. Napsauta sitä varmistaaksesi, että se avautuu ja toimii oikein.

Etkö näe widgetiä? Varmista, että olet tallentanut ja julkaissut muutoksesi. Kokeile tyhjentää selaimen välimuisti tai tarkastella sivustoasi incognito-ikkunassa. Squarespacella saattaa kestää muutama minuutti koodimuutosten käyttöönotossa. Koodi ei joskus toimi, kun olet kirjautunut Squarespaceen, joten tarkista sivusto yksityisessä ikkunassa.

Tekoälyhakupalkin lisääminen

Tekoälyhakupalkki on erillinen widget omalla koodillaan. Lisää se chatin rinnalle tai yksin. Se vaatii Standard-tilauksen tai korkeamman: alemmassa palkki näkyy mutta ei palauta tuloksia.

Lisää script-tagiin data-replace-attribuutti, niin palkki korvaa teemasi nykyisen palkin. Lisää se kohdassa Pages, Custom Code, Code Injection, Footer, samassa paikassa kuin chat-koodi. Squarespace tarjoaa Code Injectionin vain Core-, Plus- tai Advanced-paketissa (tai vanhemmassa Business- tai Commerce-paketissa), joten tarvitset jonkin niistä tämän asentamiseen.

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