Widgetin upottaminen

Aihio AI -chatbot voidaan upottaa lähes mille tahansa verkkosivulle. Tässä ohjeessa käymme läpi yleisimmät alustat.

Perusupotus (HTML)

Kopioi alla oleva koodi ja liitä se verkkosivusi HTML-koodiin ennen </body>-tagia:

<script
  src="https://widget.aihio.ai/chatbot.js"
  data-chatbot-id="SINUN_CHATBOT_ID"
  async
></script>

Chatbot ID löytyy hallintapaneelista: Chatbotit → [Valitse chatbot] → Julkaisu.

WordPress

Vaihtoehto 1: Teeman muokkaus

1. Mene Ulkoasu → Teeman muokkain
2. Valitse footer.php
3. Liitä upotuskoodi ennen </body>-tagia
4. Tallenna

Vaihtoehto 2: Lisäosa

1. Asenna "Insert Headers and Footers" -lisäosa
2. Mene Asetukset → Insert Headers and Footers
3. Liitä koodi "Footer"-kenttään
4. Tallenna

Vaihtoehto 3: Aihio AI WordPress -lisäosa

Tulossa pian! Ilmoitamme kun virallinen lisäosa on saatavilla.

Shopify

1. Mene Verkkokauppa → Teemat
2. Klikkaa Toiminnot → Muokkaa koodia
3. Avaa theme.liquid
4. Liitä koodi ennen </body>-tagia
5. Tallenna

Webflow

1. Mene Projektiasetukset → Custom Code
2. Liitä koodi Footer Code -kenttään
3. Julkaise sivusto

Wix

1. Mene Asetukset → Custom Code
2. Klikkaa Lisää koodi body-osioon
3. Liitä koodi ja valitse "All pages"
4. Tallenna ja julkaise

Squarespace

1. Mene Settings → Advanced → Code Injection
2. Liitä koodi Footer-kenttään
3. Tallenna

Google Tag Manager

1. Luo uusi Custom HTML -tagi
2. Liitä upotuskoodi
3. Aseta triggeri: "All Pages - DOM Ready"
4. Julkaise

Vianmääritys

Widget ei näy

1. Tarkista ID – Onko chatbot-id oikein?
2. Tarkista sivu – Lataa sivu uudelleen tyhjentäen välimuisti (Ctrl+Shift+R)
3. Tarkista konsoli – Avaa selaimen kehittäjätyökalut (F12) ja tarkista virheet

Widget näkyy väärässä kohdassa

Voit säätää widgetin sijaintia hallintapaneelista: Chatbot → Ulkoasu → Sijainti

Widget latautuu hitaasti

Koodi on jo optimoitu async-lataukselle. Jos ongelma jatkuu, ota yhteyttä tukeen.

Lisäasetukset

Piilota tietyillä sivuilla

<script>
  window.aihioConfig = {
    excludePages: ['/checkout', '/admin/*']
  };
</script>
<script
  src="https://widget.aihio.ai/chatbot.js"
  data-chatbot-id="SINUN_CHATBOT_ID"
  async
></script>

Avaa automaattisesti

<script>
  window.aihioConfig = {
    autoOpen: true,
    autoOpenDelay: 5000 // 5 sekunnin jälkeen
  };
</script>

Seuraavaksi

Mukauta widgetin ulkoasua

Kehittyneet integraatiomahdollisuudet