Asyntai AI -chatbotin lisääminen BigCommerceen

Vaiheittainen opas BigCommerce-kaupoille

Alusta:

Vaihe 1: Hanki upotuskoodisi

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

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></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: Valitse asennustapa

Chat-widgetin lisäämiseen BigCommerceen on useita tapoja. Valitse sinulle parhaiten sopiva menetelmä:

Tapa 1: Script Managerin käyttö (Suositeltu)

Script Manager on helpoin ja suositelluin tapa lisätä mukautettuja skriptejä BigCommerce-kauppaasi. Se ei vaadi koodausosaamista ja säilyy teemamuutosten yli.

Kirjaudu BigCommerce-hallintapaneeliin
Siirry kohtaan Storefront → Script Manager
Napsauta "Create a Script" -painiketta
Määritä skriptisi seuraavilla asetuksilla:
- Nimi: Asyntai AI Chatbot
- Kuvaus: Tekoälypohjainen chat-widget (valinnainen)
- Sijainti: Footer
- Sijainti: Kaikki sivut
- Skriptikategoria: Functional
- Skriptityyppi: Script
Liitä Asyntai-upotuskoodisi "Script Contents" -kenttään
Napsauta "Save"

Miksi käyttää Script Manageria? Script Managerin kautta lisätyt skriptit hallitaan erillään teemastasi. Niihin ei vaikuta, kun päivität tai vaihdat kauppasi teemaa.

Tapa 2: Page Builderin käyttö

Voit käyttää BigCommercen Page Builderia chat-widgetin lisäämiseen HTML-elementin avulla. Tämä tapa on hyödyllinen, jos haluat enemmän kontrollia widgetin sijaintiin.

Kirjaudu BigCommerce-hallintapaneeliin
Siirry kohtaan Storefront → My Themes
Napsauta aktiivisen teemasi "Customize" -painiketta
Etsi Page Builderin vasemmasta sivupalkista "HTML"-elementti
Vedä ja pudota HTML-elementti sivumallisi alatunnistealueelle
Napsauta HTML-elementtiä ja valitse "Edit HTML"
Liitä Asyntai-upotuskoodisi
Napsauta "Save HTML"
Click "Publish" to apply changes to your live store

Huomautus: Jos haluat chatbotin kaikille sivuille, sinun on lisättävä se globaaliin alueeseen, kuten alatunnisteeseen. Script Manager -menetelmä on helpompi koko sivuston kattavaan asennukseen.

Tapa 3: Teematiedostojen muokkaus (Stencil-teemat)

Stencil-teemoja käyttäville kehittäjille: voit lisätä koodin suoraan teematiedostoihisi. Tämä vaatii pääsyn teemasi lähdetiedostoihin.

BigCommerce-hallintapaneelin käyttö

Siirry kohtaan Storefront → My Themes
Napsauta "Advanced" aktiivisessa teemassasi
Valitse "Edit Theme Files"
Siirry kohtaan templates → components → common
Avaa footer.html
Vieritä tiedoston loppuun
Liitä Asyntai-upotuskoodisi juuri ennen sulkevaa tagia
Napsauta "Save & Apply File"

Stencil CLI:n käyttö (paikallinen kehitys)

Jos kehität paikallisesti Stencil CLI:llä:

Avaa teemasi paikalliset tiedostot
Siirry kohtaan templates/components/common/footer.html
Lisää Asyntai-upotuskoodisi ennen sulkevia tageja
Vie muutoksesi komennolla stencil push

Tärkeää: Teematiedostojen muutokset saatetaan ylikirjoittaa teemaa päivitettäessä. Pysyvää, teemapäivitysten yli säilyvää ratkaisua varten käytä Script Manager -menetelmää.

Vaihe 3: Vahvista asennus

Koodin lisäämisen jälkeen käy BigCommerce-kaupassasi uudessa selainvälilehdessä tai incognito-ikkunassa. Chat-widget-painikkeen pitäisi näkyä kauppasi oikeassa alakulmassa. Napsauta sitä varmistaaksesi, että se avautuu ja toimii oikein.

Etkö näe widgetiä? Tyhjennä selaimen välimuisti ja yritä uudelleen. Jos teit muutoksia Theme Editorin kautta, varmista että napsautit "Publish" ottaaksesi muutokset käyttöön kaupassasi.

Dokumentaatio