---
title: Miten asentaa agentti Shopifyhin
description: Mihin koodi lisätään Shopify-teemaan, miten agentti lukee kaupan tuoteluettelon, mitä tehdä ostoskorin ja maksun kanssa ja miten asennus tarkistetaan.
section: platforms
keywords: Shopify, Shopify widget asennus, theme.liquid koodi, chatbot Shopifyhin, tekoälyagentti Shopify, Shopify integraatio, AI myyntiagentti, Shopify tuoteluettelo, asiakaspalvelu Shopify, Shopify verkkokauppa, agentin asennus Shopify
updated: 2026-09-06
---
Shopifylla on jo koneellisesti luettava tuoteluettelo, joten agentti kerää tuotteet tarkemmin kuin mistään muualta: hinnat, vaihtoehdot, saatavuus ja kuvat tulevat suoraan kaupasta.

## Vaihe 1. Lisää koodi teemaan

1.  Shopifyn hallintapaneelissa avaa **Online Store → Themes**.
2.  Aktiivisen teeman kohdalla napsauta **… → Edit code**.
3.  Etsi tiedostoluettelosta `layout/theme.liquid`.
4.  Lisää koodirivi käyttöliittymästä juuri ennen sulkevaa `</body>`-tagia.
5.  Tallenna.

Vaihtoehto ilman teeman muokkausta: **Online Store → Preferences → Custom code** tai mikä tahansa sovellus skriptien lisäämiseen. Tulos on sama.

```liquid
    <!-- Commerce Agents -->
<script src="https://comag.vibevox.pro/widget.js" data-slug="oma-tunniste" async></script>
  </body>
</html>
```

Tarkka koodirivi löytyy käyttöliittymästä “Kopioi koodi” -painikkeella: siinä on jo valmiina kauppasi osoite.

## Vaihe 2. Kokoa tuoteluettelo

Määritä asetuksissa kaupan osoite ja käynnistä analyysi. Shopifyn indeksoija lukee tuotteiden jäsenneltyä dataa: nimen, hinnan, valuutan, saatavuuden, kuvauksen ja valokuvat. Vaihtoehdot (koot, värit) tallentuvat tuotekortille ominaisuuksina.

Uudelleenanalysointi päivittää hinnat ja saatavuuden. Käynnistä se suurten valikoimamuutosten jälkeen: agentti ei yhdisty suoraan tietokantaasi, vaan toimii kerätyn tuoteluettelon pohjalta.

## Vaihe 3. Jätä maksu kaupan hoidettavaksi

Shopifyssa maksamista ei tarvitse ottaa käyttöön chatissa. Oikea toimintamalli on seuraava:

1.  Määritä kaupan asetuksissa linkki ostoskoriin – yleensä `https://sinun-verkkotunnuksesi/cart`.
2.  Agentti etsii tuotteen, näyttää tuotekortin ja ohjaa painikkeen kautta ostajan Shopifyn ostoskoriin.
3.  Tilaaminen ja maksaminen tapahtuvat tuttuun tapaan, kaikkien toimitus- ja verosääntöjesi mukaisesti.

Jotta näet, mitkä keskustelut päättyvät ostokseen, lisää ostospikselin koodinpätkä kiitossivulle. Shopifyssa tämä löytyy kohdasta **Settings → Checkout → Order status page → Additional scripts**. Koodinpätkä, jossa on tilauksen numero ja summa valmiina, löytyy käyttöliittymästä, osiosta “Widget ja linkki”.

## Tuote siirtyy ostoskoriin keskeyttämättä keskustelua

Tässä Shopify näyttää parhaat puolensa muihin alustoihin verrattuna. Agentti näyttää tuotekortit valokuvan, hinnan ja painikkeen kera, mutta painike ei vain johda sivulle – se lisää tuotteen kaupan ostoskoriin.

Tämä toimii näin: Shopifyn tuotelinkissä on variantin tunniste, jonka agentti välittää ostoskoriisi Shopifyn vakiokäyttöliittymän `/cart/add.js` kautta. Sivu ei lataudu uudelleen, keskustelu ei keskeydy, ostaja näkee lyhyen vahvistuksen ja jatkaa valitsemista. Tuote on tällöin jo Shopifyn ostoskorissa – kaikkien alennus-, vero- ja toimitussääntöjesi mukaisesti.

Jos linkissä ei ole varianttia, agentti avaa tuotekortin, ja ostaja lisää sen itse. Mikään ei rikkoudu, se on vain yksi klikkaus enemmän.

Kun asiakas on valmis, “Siirry kassalle” -painike ohjaa `/cart`-sivulle, jossa kaikki on jo koottuna. Sen jälkeen on vuorossa Shopifyn tavallinen kassa.

Ja erikseen kontekstista: agentti lukee sen sivun jäsenneltyä dataa, jolla chat on avoinna. Ostaja katsoo tiettyä tuotetta ja kysyy “onko tätä L-koossa?” – agentti ymmärtää, mistä on kyse, ilman lisäkysymyksiä.

-   Avaa kauppa incognito-tilassa, odota chat-painiketta.
-   Kysy tuotteesta nimellä – tuotekortin hinnan kanssa pitäisi ilmestyä.
-   Napsauta “Siirry kassalle” – Shopifyn ostoskorin pitäisi avautua.
-   Tee testitilaus ja varmista, että ostos on merkitty “Tilauksiin”.

## Chat kaupan tyyliin

Shopifyn teema luo koko kaupan tunnelman, eikä chatin tulisi poiketa siitä. Widgetin asetuksissa on kolme vaihtoehtoa: vaalea, tumma ja “kuten kävijällä”, joka noudattaa ostajan laitteen asetuksia.

Kaupoissa, joissa on tumma teema, aseta tumma teema kiinteästi, ja vaaleissa kaupoissa vaalea. Painikkeiden korostusväri pysyy omana valintanasi molemmissa tapauksissa.

## Vaihe 4. Tarkista

## Yleisiä ongelmia

**Widget katosi teeman vaihdon jälkeen.** Koodi sijaitsee teematiedostossa. Teeman vaihtaminen tai päivittäminen poistaa muutoksen – lisää koodi uudelleen tai käytä Custom codea, joka ei riipu teemasta.

**Tuoteluettelo ei kerääntynyt kokonaan.** Indeksoija hakee tuotteet julkisilta sivuilta. Piilotetut tuotteet ja luonnokset eivät päädy luetteloon, mikä on oikein.

**Tuoteluettelon hinnat ovat vanhentuneet.** Käynnistä sivuston analyysi uudelleen, se päivittää hinnat ja saatavuuden olemassa olevien tuotekorttien osalta.

**Widget on ristiriidassa chat-sovelluksen kanssa.** Jätä käyttöön vain yksi chat: kaksi ikkunaa samassa kulmassa häiritsevät toisiaan ja hämmentävät ostajaa.

## Usein kysytyt kysymykset

### Tarvitaanko sovellusta Shopify App Storesta

Ei. Agentti yhdistetään yhdellä koodirivillä, sovelluksen asentamista ei tarvita.

### Osaako agentti näyttää tuotevaihtoehtoja

Kyllä, vaihtoehdot tallentuvat tuotekortille ominaisuuksina: koko, väri, tilavuus. Ostaja tekee tietyn vaihtoehdon valinnan Shopifyn ostoskorissa.

### Miten toimitaan useiden valuuttojen kanssa

Agentti näyttää hinnat tuoteluettelon valuutassa, jonka se määrittää indeksoinnin yhteydessä. Shopifyn monivaluuttaominaisuus toimii edelleen ostoskorin ja maksun puolella.

### Tietääkö agentti varastosaldoista

Saatavuus otetaan huomioon analyysin hetkellä. Tuotteille, jotka loppuvat usein varastosta, käynnistä analyysi useammin tai lisää ehtoihin maininta, että saatavuus tarkistetaan tilausta tehdessä.

### Vaikuttaako widget kaupan nopeuteen

Skripti latautuu asynkronisesti eikä estä renderöintiä. Tämä ei käytännössä vaikuta Core Web Vitals -mittareihin.