Chatbot WordPress-sivulle — asennusopas 2026

WordPressin päällä pyörii noin 43 % maailman verkkosivuista, ja useimmat suomalaiset yrittäjät kohtaavat tekoälychatbotin ensimmäistä kertaa juuri siellä. Aihio AI upotetaan WordPress-sivustolle yhdellä koodirivillä, joka toimii samalla tavalla kuin Google Analyticsin seurantakoodi. Asennus kestää noin viisi minuuttia, ja kaikki data pysyy EU:ssa.

Tässä oppaassa käymme läpi kolme tapaa lisätä chatbot (puhdas HTML-koodipätkä, WordPress-lisäosa, Elementorin Custom HTML -lohko) sekä GDPR-mukaisen suostumusketjun.

Ennen kuin aloitat

Tarvitset:

• Ylläpitäjän käyttöoikeudet WordPress-hallintapaneeliin
• Aihio-tilin (ilmainen tili riittää)
• Brändivärisi valmiina (pääväri + tekstiväri chatbotille)

Kirjaudu Aihioon ja syötä verkkosivusi osoite. Tekoäly lukee sivustosi sisällön ja luo tietopohjan. Tämä kestää muutamasta sekunnista pariin minuuttiin sivuston koosta riippuen. Kun se on valmis, siirry kohtaan Asetukset → Upotus ja kopioi koodi talteen.

Koodi näyttää tältä:

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

Tapa 1: Lisää koodi teemaan (suoraviivaisin)

WordPressin perusasennuksessa voit lisätä koodin kahdella tavalla.

Vaihtoehto A: Ulkoasu → Mukauta → Lisäasetukset → Head-koodi

Jos teemasi tukee mukautuksen kautta tehtäviä head-muokkauksia (useimmat nykyteemat tukevat), käytä sitä. Koodi lisätään vain kerran ja säilyy teemapäivitysten yli.

1. Avaa Ulkoasu → Mukauta

   Klikkaa yläpalkista “Mukauta”. Etsi valikosta “Lisäasetukset” tai “Custom Code”. Teemakohtainen kohta vaihtelee.

2. Liitä koodi head-kenttään

   Avaa “Head” tai “Header scripts” -kenttä ja liitä Aihion <script>-pätkä. Tallenna.

3. Päivitä sivu ja testaa

   Siirry verkkosivustollesi ja odota muutama sekunti. Chatbot-ikkuna ilmestyy oikeaan alakulmaan.

Vaihtoehto B: Lisäosa (esim. “Insert Headers and Footers”)

Jos teemasi ei tue head-muokkausta, asenna ilmainen lisäosa kuten Insert Headers and Footers (WPCode) tai Head, Footer and Post Injections. Liitä Aihion koodi lisäosan “Header”-kenttään.

Tapa 2: Elementor + Custom HTML

Jos sivustosi on rakennettu Elementorilla, voit lisätä chatbotin yksittäiselle sivulle tai globaalisti.

1. Yksittäinen sivu

   Muokkaa sivua Elementorilla, lisää “HTML”-widget ja liitä koodi sen sisään. Chatbot näkyy vain tällä sivulla.

2. Globaalisti kaikilla sivuilla

   Elementor Pro -käyttäjät: mene kohtaan Mallit → Teemarakennus → Header, avaa header-template ja lisää HTML-widget headerin sisälle. Koodi ajetaan nyt kaikilla sivuilla.

Tapa 3: WordPress-lisäosa (tulossa)

Aihion oma WordPress-lisäosa on tulossa Q2 2026. Se tarjoaa graafisen asennuksen, sisäänrakennetun suostumusintegraation ja automaattisen sivustopäivityksen tunnistamisen. Seuraa muutoslokia.

GDPR ja suostumus

Chatbot asettaa selaimen paikalliseen varastoon muutaman avaimen (keskustelun tunniste ja istunnon tila). Nämä eivät ole evästeitä, mutta GDPR-arvioinnin mukaan niitä voidaan silti pitää online-tunnisteina toteutuksesta ja kontekstista riippuen. Tarkista oma DPIA:si organisaatiosi kanssa. Lisäksi monet suostumusalustat käsittelevät kaikki “kolmannen osapuolen skriptit” samalla tavalla.

Cookiebotin, Complianzin ja muiden kanssa

Useimmat suomalaiset WordPress-sivustot käyttävät Complianzia tai Cookiebottia suostumukseen. Molemmat sallivat ehdollisen skriptin latauksen:

Jos luokittelet chatbotin vaativan suostumuksen, kääri latausskripti suostumuskomponenttiin:

<!-- Complianz: odota suostumusta ennen lataamista -->
<script type="text/plain" data-category="functional"
        src="https://aihio.ai/widget/aihio-loader.js"
        data-chatbot-id="your-chatbot-id"></script>

Muista testata, että chatbot todella näkyy evästeiden hyväksymisen jälkeen. Complianz tarvitsee joskus sivulatauksen uudelleen.

Yleisimmät ongelmat

”Chatbot ei näy mitenkään”

Tarkista ensin selaimen kehittäjätyökaluista (F12 → Console):

• Näetkö virheen 404 aihio-loader.js? Skriptin URL on väärin kirjoitettu, selaimen lisäosa tai palomuuri estää sen, tai tiedostoa ei löydy annetusta polusta.
• Näetkö virheen CSP blocked? Sivustollasi on Content Security Policy, joka estää kolmannen osapuolen skriptit. Lisää aihio.ai poikkeuksiin.

”Chatbot vastaa hitaasti”

Ensimmäinen vastaus voi kestää 2–5 sekuntia, koska tekoäly prosessoi kysymyksen. Jos odotusaika on yli 10 sekuntia, tarkista hallintapaneelista miten iso tietopohja on — yli 1 000 sivun tietopohja hidastaa vastauksia.

”Chatbot kysyy asiakkaalle kirjautumista”

WordPressin oletus-CSP estää joskus Aihion yhteydet. Aihion chatbot-asetukset löytyvät sovelluksesta, eivätkä vaadi erillistä kirjautumista asiakkaan päässä.

Testaa ennen julkaisua

Kun olet lisännyt koodin, tee ennen live-julkaisua näin:

1. Avaa sivustosi incognito-ikkunassa

   Näin varmistat että näet mitä tavallinen kävijä näkee. Älä testaa kirjautuneena ylläpitäjänä.

2. Odota 3–5 sekuntia

   Chatbot-ikkunan latauksen pitäisi valmistua tässä ajassa. Jos se ei näy, katso kehittäjätyökalujen Console-välilehteä.

3. Kysy testikysymys

   Kysy chatbotilta jotain sivusi sisältöön liittyvää (esim. aukioloajat tai yhteystiedot). Vastauksen pitäisi olla oikein muutamassa sekunnissa.

4. Tarkista mobiilinäkymä

   Avaa sivusto puhelimesta. Chatbot-ikkuna skaalautuu mobiilille automaattisesti, mutta sen paikka ei saa peittää kriittistä sisältöä tai CTA-nappeja.

Usein kysytyt kysymykset

Asennus valmis

Kun koodi on sivullasi ja testikysymys toimi, chatbot on käytössä. Seuraa ensimmäisen viikon ajan analytiikkaa: mitkä kysymykset toistuvat, missä chatbot ei osaa vastata, ja miten pitkiä keskustelut ovat.

Luo chatbot ilmaiseksi ja upota se WordPress-sivullesi. Asennusvaihe kestää alle viisi minuuttia.