---
title: Miten asentaa agentti WordPressiin ja WooCommerceen
description: Kolme tapaa lisätä koodi WordPressiin, miten agentti lukee WooCommerce-luetteloa, mitä tehdä välimuistilaajennusten kanssa ja miten yhdistää chat ostoskoriin.
section: platforms
keywords: WordPress, WooCommerce, WordPress-widget, chat verkkosivulle, AI-agentti verkkokauppaan, koodin asennus WordPressiin, footer.php, välimuistilaajennukset WordPress, chat-integraatio, tekoälychat, verkkokaupan chat, WordPress-laajennus
updated: 2026-09-06
---
WordPressiin koodi lisätään kolmella tavalla. Valitse sen mukaan, kuinka tuttua teematiedostojen muokkaaminen sinulle on.

## Tapa 1: Koodin lisäysliitännäinen (suositus)

Turvallisin vaihtoehto: muutokset eivät katoa teeman päivityksen yhteydessä.

1. Asenna mikä tahansa skriptien lisäysliitännäinen: WPCode, Insert Headers and Footers, Code Snippets.
2. Avaa liitännäisen asetukset ja etsi kenttä koodille alatunnisteesta – se on yleensä nimeltään **Footer** tai **Body (before closing tag)**.
3. Liitä rivi hallintapaneelista ja tallenna.

## Tapa 2: Teematiedosto

1. **Ulkoasu → Teematiedostojen muokkaaja**.
2. Avaa `footer.php`.
3. Liitä koodi ennen `</body>`-tagia.
4. Päivitä tiedosto.

Tärkeää: muokkaa lapsiteemaa. Emoteeman päivityksen yhteydessä tiedosto ylikirjoittuu koodisi kanssa.

## Tapa 3: functions.php-tiedoston kautta

Niille, joille koodi on tutumpaa. Lapsiteeman `functions.php`-tiedostoon:

```php
add_action('wp_footer', function () {
`echo '<script src="https://comag.vibevox.pro/widget.js" data-slug="oma-slugisi" async></script>';`
});
```

Tarkka skriptirivi löytyy hallintapaneelista, “Kopioi koodi” -painikkeella.

## WooCommerce-tuoteluettelo

Määritä verkkosivuston osoite asetuksissa ja käynnistä analyysi. Hakurobotti lukee WooCommerce-tuotteet sivujen strukturoitujen tietojen kautta: nimi, hinta, saatavuus, kuvaus, valokuvat, kategoriat.

Mitä kannattaa tietää:

- **Vaihtelevat tuotteet** näkyvät tuotekortilla hinta-alueen ja ominaisuuksien kanssa.
- **Piilotetut tuotteet ja luonnokset** eivät näy – ja niin kuuluukin olla.
- **Vain kirjautuneille käyttäjille tarkoitetut tuotteet** eivät näy agentille: se selaa sivustoa tavallisena kävijänä.
- Jos sinulla on tuotteiden CSV-vienti, sen voi ladata “Tuoteluettelo”-osiossa – tämä on joskus nopeampaa ja tarkempaa kuin sivuston läpikäynti.

## Ostoskori ja maksu

WooCommercessa maksua ei yleensä sisällytetä chattiin: kaupalla on oma kassajärjestelmä toimituksineen, veroineen ja kuponkeineen.

Määritä asetuksissa linkki ostoskoriin, useimmiten `https://oma-verkkotunnuksesi/cart` tai `/ostoskori`. Agentti ohjaa ostajan sinne.

Jotta näet, mitkä keskustelut muuttuvat tilauksiksi, lisää ostospikselin koodinpätkä “Kiitos tilauksesta” -sivulle. WooCommercessa tämä on `checkout/thankyou.php`-malli tai sama koodin lisäysliitännäinen tilaussivun ehdolla.

## Chatissa oleva painike lisää tuotteen WooCommerce-ostoskoriin

Agentin vastauksissa olevat tuotekortit eivät ole vain kauniita kuvia. Jokaisella on linkki tuotteen sivulle kaupassasi, ja agentti osaa käyttää WooCommerce-standardimekanismia tuotteen lisäämiseen ostoskoriin: osoitteella `?add-to-cart=123`.

Ostaja painaa chatissa olevaa painiketta, tuote päätyy ostoskoriin, ja sen jälkeen toimii kassasi kaikkine toimitus-, kuponki- ja veroliitännäisineen. Mitään integraatioita tai avaimia ei tarvita: mekanismi on sisäänrakennettu WooCommerceen alusta alkaen.

Jos linkki johtaa vaihtelevan tuotteen sivulle, agentti avaa sen – ostajan on valittava koko ja väri itse, ja tämä on oikein: vaihtoehdon asettaminen hänen puolestaan on riskialtista.

Toinen asia, joka kannattaa tietää: agentti näkee sivun, jolla chat on avattu. Se lukee tuotteen merkinnät – nimen, SKU:n, hinnan – ja vastaa kontekstissa. Kävijä on tuotekortilla ja kirjoittaa “onko halvempaa?” – agentti ymmärtää, mihin verrata, ja ehdottaa vaihtoehtoa luettelostasi, eikä abstraktia neuvoa.

Pääsyy siihen, miksi “widget ei ilmestynyt” WordPressissä, on välimuisti. Koodin lisäämisen jälkeen:

1. Tyhjennä liitännäisen välimuisti: WP Rocket, W3 Total Cache, LiteSpeed tai mikä sinulla on käytössä.
2. Tyhjennä CDN:n välimuisti, jos käytät Cloudflarea.
3. Tarkista sivusto incognito-tilassa.

Jos liitännäisessä on käytössä “skriptien yhdistäminen ja viivästetty lataus”, lisää skriptimme poikkeuksiin: kolmannen osapuolen skriptien yhdistäminen voi joskus rikkoa latauksen.

## Vaalea ja tumma teema

Widget tukee molempia. Asetuksista voi valita vaalean teeman, tumman tai “kuten kävijällä” – jälkimmäinen seuraa laitteen järjestelmäasetuksia ja on oletuksena.

Tämä on kätevää, jos WordPress-teemassasi on päivä- ja yöasetuksen vaihtaja: jätä asetukseksi “kuten kävijällä”, ja chat vastaa sitä, mitä käyttäjä on jo valinnut.

## Välimuistiliitännäiset

## Tarkistus

- Chat-painike ilmestyy oikeaan alakulmaan millä tahansa sivuston sivulla.
- Tuotetta koskeva kysymys tuottaa tuotekortin hintoineen.
- Tilauspainike johtaa WooCommerce-ostoskoriin.
- Mobiililaitteella painike ei peitä valikkoa ja ostoskoria.

## Usein kysytyt kysymykset

### Tarvitaanko erillinen Commerce Agents -liitännäinen

Ei. Yksi koodirivi riittää, erillistä liitännäistä ei tarvita eikä asenneta.

### Widget ei ilmestynyt, mitä tarkistaa ensin

Välimuisti: välimuistiliitännäinen ja CDN. Sen jälkeen – että koodi on lisätty alatunnisteeseen, eikä sivupalkin mukautettuun widgetiin, ja että teema todella näyttää `wp_footer()`-funktion.

### Tietääkö agentti alennuksista ja kupongeista

Kupongeista ei tiedä: ne käytetään WooCommerce-ostoskorissa. Agentti näyttää ne hinnat, jotka olivat voimassa sivuston läpikäynnin aikana, mukaan lukien alennetun hinnan, jos se näkyy tuotesivulla.

### Hidastaako tämä sivustoa

Skripti on asynkroninen, painaa vähän eikä estä sivun renderöintiä. Vaikutus PageSpeediin on minimaalinen.

### Voidaanko widget näyttää vain kaupassa, ei blogissa

Kyllä, jos koodi lisätään liitännäisen kautta näyttöehdoilla tai `functions.php`-tiedostoon `is_woocommerce()`-tarkistuksella. Yksinkertaisessa tapauksessa agentti ei häiritse kaikilla sivuilla: se vastaa myös blogin toimituskysymyksiin.