Miten asentaa agentti WordPressiin ja WooCommerceen

Kolme tapaa lisätä koodi WordPressiin, miten agentti lukee WooCommerce-luetteloa, mitä tehdä välimuistilaajennusten kanssa ja miten yhdistää chat ostoskoriin.

6. syyskuuta 2026

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:

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.