Slik legger du til Asyntai AI-chatbot på WooCommerce

Trinn-for-trinn-guide for WooCommerce-butikker

Hent innebyggingskode

Trinn 1: Hent innbyggingskoden din

Gå først til Asyntai-dashbordet ditt og bla ned til «Innbyggingskode»-seksjonen. Kopier din unike innbyggingskode som vil se slik ut:

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

Merk: Koden ovenfor er bare et eksempel. Du må kopiere din egen unike innbyggingskode fra Dashbordet ditt, da den inneholder din personlige widget-ID.

Trinn 2: Bruk av utvidelse (anbefalt)

Den enkleste måten å legge til chatboten i WooCommerce-butikken din er ved å bruke en gratis topp-/bunntekst-utvidelse:

  1. Logg inn på WordPress-administrasjonspanelet
  2. Gå til Utvidelser → Legg til ny
  3. Søk etter "Insert Headers and Footers" av WPCode (eller lignende utvidelse)
  4. Klikk på "Installer nå" og deretter "Aktiver"
  5. Gå til Code Snippets → Header & Footer (eller utvidelsens innstillingsside)
  6. Lim inn Asyntai-innbyggingskoden din i "Bunntekst"-seksjonen
  7. Klikk på "Lagre endringer"

Tips: Å legge til koden i bunnteksten sikrer at den lastes inn etter butikkens innhold, noe som er ideelt for chat-widgeter og ikke vil bremse sideinnlastingen eller forstyrre WooCommerce-funksjonaliteten.

Alternativ: Bruk av tematilpasser

Mange WooCommerce-temaer har innebygde alternativer for å legge til tilpassede skript:

  1. Gå til Utseende → Tilpass
  2. Se etter en seksjon kalt "Ekstra CSS/JS", "Egendefinert kode" eller "Bunntekstskript"
  3. Lim inn Asyntai-innbyggingskoden i det aktuelle feltet
  4. Klikk på "Publiser" for å lagre endringene dine

Merk: Ikke alle temaer har dette alternativet. Hvis temaet ditt ikke inkluderer felt for tilpassede skript, bruk utvidelsesmetoden eller rediger temaets functions.php-fil.

Alternativ: Rediger temafiler (functions.php)

For utviklere eller de som er komfortable med å redigere temafiler:

  1. Gå til Utseende → Temafilredigerer
  2. Velg det aktive temaet ditt (eller helst barnetemaet)
  3. Åpne functions.php-filen
  4. Legg til følgende kode på slutten av filen:
    function add_asyntai_chatbot() {
      echo '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>';
    }
    add_action('wp_footer', 'add_asyntai_chatbot');
  5. Erstatt YOUR_WIDGET_ID med din faktiske widget-ID
  6. Klikk på "Oppdater fil"

Viktig: Bruk alltid et barnetema når du redigerer temafiler. Endringer i hovedtemaet vil gå tapt når du oppdaterer temaet. Hvis du ikke er komfortabel med å redigere kode, bruk utvidelsesmetoden i stedet.

Alternativ: WooCommerce-spesifikk hook

For å laste chatboten kun på WooCommerce-sider (butikk, produkt, handlekurv, kasse):

  1. Legg til denne koden i temaets functions.php-fil:
    function add_asyntai_chatbot_woocommerce() {
      if (is_woocommerce() || is_cart() || is_checkout() || is_account_page()) {
        echo '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>';
      }
    }
    add_action('wp_footer', 'add_asyntai_chatbot_woocommerce');
  2. Erstatt YOUR_WIDGET_ID med din faktiske widget-ID
  3. Lagre filen

Tips: Denne metoden er nyttig hvis du bare vil at AI-chatboten skal vises på butikksidene dine for å hjelpe kunder med produkter og bestillinger, i stedet for på hele nettstedet.

Trinn 3: Bekreft installasjonen

Etter at du har lagret endringene, besøk WooCommerce-butikken din i en ny nettleserfane eller inkognitovindu. Du bør se chat-widget-knappen i nedre høyre hjørne. Klikk på den for å forsikre deg om at den åpnes og fungerer riktig.

Ser du ikke widgeten? Hvis du har en mellomlagringsutvidelse installert (som WP Super Cache, W3 Total Cache eller WP Rocket), tøm mellomlageret først. Prøv også å tømme nettleserbufferen eller se i et inkognitovindu.