Osta-painikkeen luominen
Kun olet lisännyt Osta-painikkeen myyntikanavan Shopify Adminissa, voit luoda Osta-painikkeen tuotteelle tai kokoelmalle.
Kun olet luonut Osta-painikkeen, kopioi automaattisesti luotu koodi ja lisää kyseinen koodi sitten verkkosivulle tai blogipostaukseen, jossa haluat painikkeen näkyvän. Voit esimerkiksi haluta Osta-painikkeen WordPress-blogiin tai Squarespace-verkkosivulle.
Osta-painikkeen ulkoasua ei voi muuttaa, kun olet sulauttanut sen verkkosivullesi. Jos haluat muuttaa painikkeen ulkoasua, sinun on luotava kanavaan uusi painike ja korvattava alkuperäinen koodi uudella koodilla.
Tällä sivulla
Osta-painikkeiden mukauttaminen
Voit muokata seuraavia seikkoja Osta-painikkeen ulkoasusta ja sen toimintatavasta:
- väri
- koko
- fontti
- painiketta klikkaamalla tapahtuva toimenpide
- sitä, avautuuko kassa uudessa selainikkunassa
Kun mukautat painiketta, voit esikatsella muutoksia. Voit kokeilla Osta-painikkeen toimintaa klikkaamalla esikatselua.
Asettelutyyli
Voit valita Osta-painikkeen asettelun.
Basic | Valitse tämä asettelu, jos haluat lisätä Osta-painikkeen ilman tuotekuvaa. Voit haluta tehdä näin, jos tuotteet ovat jo nähtävillä muualla verkossa, mutta haluat vain lisätä painikkeen ostoksen tekemiseen. |
Perinteinen | Valitse tämä asettelu, jos haluat näyttää tuotekuvan ja hinnan Osta-painikkeen vieressä. Tämä asettelu on kätevä tuotteiden nopeassa esikatselussa, esimerkiksi blogipostauksessa. |
Kokonäkymä | Valitse tämä asettelu, jos haluat näyttää tuotekuvan, hinnan ja kuvauksen Osta-painikkeen vieressä. Tämä asettelu jäljittelee verkkokaupasi tuotetietosivua. |
Osta-painikkeen toiminnot
Kun luot Osta-painikkeen, voit valita toiminnon, joka suoritetaan, kun painiketta napautetaan.
Jos Osta-painike koskee kokoelmaa, toimenpide koskee kokoelman jokaista tuotetta.
- Lisää tuote ostoskoriin lisää tuotteen ostoskoriin. Asiakkaat voivat jatkaa ostoksia ja lisätä tuotteita ostoskoriin.
- Suoraan kassalle vie asiakkaan suoraan kassalle, jossa hän voi ostaa tuotteen. Asiakkaat eivät pysty lisäämään tuotteita tilauksiinsa.
-
Avaa tuotetiedot näyttää Näytä tuote -painikkeen. Kun asiakas klikkaa painiketta, hän näkee tuotteen kuvauksen, voi valita jonkin käytettävissä olevista tuoteversioista ja lisätä tuotteen ostoskoriin. Jos tuotteesta on useita tuotekuvia, ne näkyvät myös.
- Tämä vaihtoehto ei ole käytettävissä, kun valitset laajan pohjan, koska laaja pohja näyttää jo kaikki tuotetiedot.
Voit myös valita, avautuuko kassa uudessa selainikkunassa vai samassa välilehdessä kuin verkkosivusi. Oletusarvoisesti kassa avautuu uudessa ikkunassa.
Osta-painikkeen ulkoasu
- Painikkeen tyyli sisältää Osta-painikkeen painikeosan muodon, värin ja typografian.
- Asettelu – valitsemastasi asettelutyylistä riippuen voit mukauttaa asetuksia, kuten painikkeen kohdistamista, kuvan kokoa, painikkeen tekstiä, fonttia, väriä ja kokoa.
-
Ostoskori sisältää sulautetun ostoskorin teksti- ja väriasetukset. Voit ottaa käyttöön ja mukauttaa myös Tilausviesti-kentän tunnuksen. Voit käyttää tilausviestejä, kun haluat kerätä asiakkailta erityisiä ohjeita tilauksen valmistelua ja toimittamista varten. Lisätietoja-kentän avulla voit viestiä asiakkaillesi.
- Voit muokata ostoskorin asetuksia vain, jos olet valinnut painikkeen toiminnoksi Lisää tuote ostoskoriin tai Avaa tuotetiedot.
Yksityiskohtainen ponnahdusikkuna sisältää tuotetietojen ponnahdusikkunan asetukset. Voit muokata painikkeen tekstiä, valita määräkentän näkyvyysasetuksen, valita taustan ja selitteiden värit sekä selitteiden fontin ja fonttikoon. Voit muokata näitä asetuksia vain, jos olet valinnut painikkeen toiminnoksi Avaa tuotetiedot.
Osta-painikkeen luominen yhdelle tuotteelle
Voit luoda Osta-painikkeen yksittäiselle tuotteelle. Osta-painike voi sisältää yhden variantin tai kaikki tuotteen variantit. Kun luot Osta-painikkeen, valitset asettelutyylin ja mukautat painikkeen värin, tekstin, ulkoasun sekä tapahtumavaiheet asiakkaan klikattua painiketta. Katso lisätietoja Osta-painikkeiden mukauttamisesta.
Ennen kuin luot tuotteelle Osta-painikkeen, lisää tuote Shopify Adminissa ja tuo se Osta-painikkeen myyntikanavan käytettäväksi.
Tee näin:
Tietokone
Siirry Shopify Administa kohtaan Asetukset > Sovellukset ja myyntikanavat.
Klikkaa Sovellukset ja myyntikanavat -sivulla Buy Button.
Klikkaa Avaa myyntikanava.
Klikkaa kohtaa Luo Osta-painike.
Valitse Tuotteen Osta-painike.
Valitse tuote luettelosta tai etsi tuote käyttämällä hakua. Klikkaa kohtaa Valitse.
-
Valinnainen: mukauta Osta-painiketta.
- Jos tuotteesta on tuoteversioita, valitse Kaikki versiottai valitse haluamasi versio.
- Valitse pohjan tyyli ja toiminto, joka tapahtuu, kun asiakas klikkaa painiketta. Voit myös mukauttaa painikkeen ulkoasua.
- Maksutapahtuma avaa oletusarvoisesti uuden ikkunan, mutta voit myös valita kassan avautumaan verkkosivun kanssa samaan välilehteen. Klikkaa Lisäasetukset >Uudelleenohjaus samaan välilehteen.
Klikkaa Seuraava.
Klikkaa kohtaa Kopioi koodi.
Avaa sen verkkosivun HTML-editori, jossa haluat näyttää Osta-painikkeen. Lue lisää kohdasta Osta-painikkeen koodin lisääminen HTML:ään.
Liitä koodi HTML:ään kohtaan, jossa haluat Osta-painikkeen näkyvän, ja tallenna sitten muutokset.
iPhone
- Napauta Shopify-sovelluksessa …-painiketta.
- Napauta Myyntikanava-osiossa Osta-painiketta.
- Napauta Luo Osta-painiketta.
- Napauta Tuotteen Osta-painike.
- Valitse tuote luettelosta tai etsi tuote käyttämällä hakua, ja napauta sitten Valitse.
-
Valinnainen: Napauta Mukauta.
- Jos tuotteesta on useita versioita, valitse Kaikki versiottai valitse haluamasi versio avattavasta luettelosta.
- Valitse pohjan tyyli ja toiminto, joka tapahtuu, kun asiakas klikkaa painiketta. Voit myös mukauttaa painikkeen ulkoasua.
- Maksutapahtuma avaa oletusarvoisesti uuden ikkunan, mutta voit myös valita kassan avautumaan verkkosivun kanssa samaan välilehteen. Napauta Lisäasetukset >Uudelleenohjaus samaan välilehteen.
Napauta Valmis.
Napauta Kopioi koodi.
Avaa sen verkkosivun HTML-editori, jossa haluat näyttää Osta-painikkeen. Lue lisää kohdasta Osta-painikkeen koodin lisääminen HTML:ään.
Liitä koodi HTML:ään kohtaan, jossa haluat Osta-painikkeen näkyvän, ja tallenna sitten muutokset.
Android
- Napauta Shopify-sovelluksessa …-painiketta.
- Napauta Myyntikanava-osiossa Osta-painiketta.
- Napauta Luo Osta-painiketta.
- Napauta Tuotteen Osta-painike.
- Valitse tuote luettelosta tai etsi tuote käyttämällä hakua, ja napauta sitten Valitse.
-
Valinnainen: Napauta Mukauta.
- Jos tuotteesta on useita versioita, valitse Kaikki versiottai valitse haluamasi versio avattavasta luettelosta.
- Valitse pohjan tyyli ja toiminto, joka tapahtuu, kun asiakas klikkaa painiketta. Voit myös mukauttaa painikkeen ulkoasua.
- Maksutapahtuma avaa oletusarvoisesti uuden ikkunan, mutta voit myös valita kassan avautumaan verkkosivun kanssa samaan välilehteen. Napauta Lisäasetukset >Uudelleenohjaus samaan välilehteen.
Napauta Valmis.
Napauta Kopioi koodi.
Avaa sen verkkosivun HTML-editori, jossa haluat näyttää Osta-painikkeen. Lue lisää kohdasta Osta-painikkeen koodin lisääminen HTML:ään.
Liitä koodi HTML:ään kohtaan, jossa haluat Osta-painikkeen näkyvän, ja tallenna sitten muutokset.
Osta-painikkeen luominen kokoelmalle
Kun luot kokoelmalle Osta-painikkeen, luot itse asiassa painikkeen kokoelman jokaiselle tuotteelle.
Kun luot Osta-painikkeen, valitset asettelutyylin ja mukautat painikkeen värin, tekstin, ulkoasun sekä tapahtumavaiheet asiakkaan klikattua painiketta. Lue lisätietoja Osta-painikkeiden mukauttamisesta.
Ennen kuin luot kokoelman Osta-painikkeen, varmista, että olet
- lisännyt tuotteet Shopify Adminissa
- asettanut tuotteet saataville Osta-painikkeen myyntikanavaan
- luonut kokoelman.
Tee näin:
Tietokone
Siirry Shopify Administa kohtaan Asetukset > Sovellukset ja myyntikanavat.
Klikkaa Sovellukset ja myyntikanavat -sivulla Buy Button.
Klikkaa Avaa myyntikanava.
Klikkaa kohtaa Luo Osta-painike.
Klikkaa kokoelman Osta-painiketta.
Valitse kokoelma tai etsi kokoelma käyttämällä hakua. Klikkaa kohtaa Valitse.
-
Valinnainen: mukauta Osta-painiketta.
- Valitse toiminto, joka tapahtuu, kun asiakas klikkaa painiketta. Voit myös mukauttaa painikkeen ulkoasua.
- Maksutapahtuma avaa oletusarvoisesti uuden ikkunan, mutta voit myös valita kassan avautumaan verkkosivun kanssa samaan välilehteen. Klikkaa Lisäasetukset >Uudelleenohjaus samaan välilehteen.
Klikkaa Seuraava.
Klikkaa kohtaa Kopioi koodi.
Avaa sen verkkosivun HTML-editori, jossa haluat näyttää Osta-painikkeen. Lue lisää kohdasta Osta-painikkeen koodin lisääminen HTML:ään.
Liitä koodi HTML:ään kohtaan, jossa haluat Osta-painikkeen näkyvän, ja tallenna sitten muutokset.
iPhone
- Napauta Shopify-sovelluksessa …-painiketta.
- Napauta Myyntikanava-osiossa Osta-painiketta.
- Napauta Luo Osta-painiketta.
- Napauta Kokoelman Osta-painike.
- Valitse kokoelma tai etsi kokoelma käyttämällä hakua, ja napauta sitten Valitse.
-
Valinnainen: Napauta Mukauta.
- Valitse toiminto, joka tapahtuu, kun asiakas klikkaa painiketta. Voit myös mukauttaa painikkeen ulkoasua.
- Maksutapahtuma avaa oletusarvoisesti uuden ikkunan, mutta voit myös valita kassan avautumaan verkkosivun kanssa samaan välilehteen. Napauta Lisäasetukset >Uudelleenohjaus samaan välilehteen.
Napauta Valmis.
Napauta Kopioi koodi.
Avaa sen verkkosivun HTML-editori, jossa haluat näyttää Osta-painikkeen. Lue lisää kohdasta Osta-painikkeen koodin lisääminen HTML:ään.
Liitä koodi HTML:ään kohtaan, jossa haluat Osta-painikkeen näkyvän, ja tallenna sitten muutokset.
Android
- Napauta Shopify-sovelluksessa …-painiketta.
- Napauta Myyntikanava-osiossa Osta-painiketta.
- Napauta Luo Osta-painiketta.
- Napauta Kokoelman Osta-painike.
- Valitse kokoelma tai etsi kokoelma käyttämällä hakua, ja napauta sitten Valitse.
-
Valinnainen: Napauta Mukauta.
- Valitse toiminto, joka tapahtuu, kun asiakas klikkaa painiketta. Voit myös mukauttaa painikkeen ulkoasua.
- Maksutapahtuma avaa oletusarvoisesti uuden ikkunan, mutta voit myös valita kassan avautumaan verkkosivun kanssa samaan välilehteen. Napauta Lisäasetukset >Uudelleenohjaus samaan välilehteen.
Napauta Valmis.
Napauta Kopioi koodi.
Avaa sen verkkosivun HTML-editori, jossa haluat näyttää Osta-painikkeen. Lue lisää kohdasta Osta-painikkeen koodin lisääminen HTML:ään.
Liitä koodi HTML:ään kohtaan, jossa haluat Osta-painikkeen näkyvän, ja tallenna sitten muutokset.