Sådan tilføjer du Asyntai AI-chatbot til BigCommerce

Trin-for-trin-vejledning til BigCommerce-butikker

Hent indlejringskode

Trin 1: Hent din indlejringskode

Gå først til dit Asyntai Dashboard og rul ned til sektionen "Indlejringskode". Kopiér din unikke indlejringskode, der vil se sådan ud:

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

Bemærk: Koden ovenfor er blot et eksempel. Du skal kopiere din egen unikke indlejringskode fra dit Dashboard, da den indeholder dit personlige widget-ID.

Trin 2: Vælg installationsmetode

Der er flere måder at tilføje chat-widget'en til BigCommerce på. Vælg den metode, der fungerer bedst for dig:

Metode 1: Brug af Script Manager (anbefalet)

Script Manager er den nemmeste og anbefalede måde at tilføje brugerdefinerede scripts til din BigCommerce-butik på. Det kræver ingen kodekendskab og bevares på tværs af temaændringer.

  1. Log ind på dit BigCommerce-kontrolpanel
  2. Gå til Storefront → Script Manager
  3. Klik på knappen "Opret et script"
  4. Konfigurer dit script med disse indstillinger:
    • Navn: Asyntai AI Chatbot
    • Beskrivelse: AI-drevet chat-widget (valgfrit)
    • Placering: Sidefod
    • Placering: Alle sider
    • Scriptkategori: Funktionel
    • Scripttype: Script
  5. I boksen "Scriptindhold" skal du indsætte din Asyntai indlejringskode
  6. Klik på "Gem"

Hvorfor bruge Script Manager? Scripts tilføjet via Script Manager administreres separat fra dit tema. De påvirkes ikke, når du opdaterer eller ændrer dit butikstema.

Metode 2: Brug af Page Builder

Du kan bruge BigCommerce's Page Builder til at tilføje chat-widget'en ved hjælp af et HTML-element. Denne metode er nyttig, hvis du ønsker mere kontrol over, hvor widget'en vises.

  1. Log ind på dit BigCommerce-kontrolpanel
  2. Gå til Storefront → Mine temaer
  3. Klik på knappen "Tilpas" på dit aktive tema
  4. I Page Builder's venstre sidebjælke skal du finde elementet "HTML"
  5. Træk og slip HTML-elementet til sidefodsområdet i din sideskabelon
  6. Klik på HTML-elementet og vælg "Rediger HTML"
  7. Indsæt din Asyntai indlejringskode
  8. Klik på "Gem HTML"
  9. Click "Publish" to apply changes to your live store

Bemærk: Hvis du vil have chatbotten på alle sider, skal du tilføje den til et globalt område som sidefoden. Script Manager-metoden er nemmere til installation på hele webstedet.

Metode 3: Rediger temafiler (Stencil-temaer)

For udviklere, der bruger Stencil-temaer, kan du tilføje koden direkte til dine temafiler. Dette kræver adgang til dit temas kildefiler.

Brug af BigCommerce-kontrolpanelet

  1. Gå til Storefront → Mine temaer
  2. Klik på "Avanceret" på dit aktive tema
  3. Vælg "Rediger temafiler"
  4. Naviger til templates → components → common
  5. Åbn footer.html
  6. Rul til bunden af filen
  7. Indsæt din Asyntai indlejringskode lige inden det afsluttende tag
  8. Klik på "Gem og anvend fil"

Brug af Stencil CLI (lokal udvikling)

Hvis du udvikler lokalt med Stencil CLI:

  1. Åbn dit temas lokale filer
  2. Naviger til templates/components/common/footer.html
  3. Tilføj din Asyntai indlejringskode inden de afsluttende tags
  4. Send dine ændringer med stencil push

Vigtigt: Temafilændringer kan blive overskrevet, når du opdaterer dit tema. For en permanent løsning, der bevares på tværs af temaopdateringer, skal du bruge Script Manager-metoden.

Trin 3: Verificér installationen

Når du har tilføjet koden, skal du besøge din BigCommerce-butik i en ny browserfane eller et inkognitovindue. Du bør se chat-widget-knappen i nederste højre hjørne af din butik. Klik på den for at sikre, at den åbner og fungerer korrekt.

Ser du ikke widget'en? Ryd din browsers cache og prøv igen. Hvis du har foretaget ændringer via Tema-editoren, skal du sørge for, at du klikkede på "Publicér" for at anvende ændringerne på din live-butik.