> ## Documentation Index
> Fetch the complete documentation index at: https://www.zippendo.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Hanki Google-avaimet noutopistekarttaa ja osoitehakua varten

> Luo kaksi avainta omalla Google Cloud -tililläsi ja lisää ne Zippendo-sovellukseen, jotta asiakkaat voivat valita noutopisteensä kartalta ja hakea osoitetta Shopify-kassalla.

Asiakkaasi voivat jo nyt valita noutopisteensä luettelosta. Kassalla he voivat hakea sitä postinumerolla tai noutopisteen nimellä ja ostoskorissa postinumerolla. Kahdella omalta Google-tililtäsi saatavalla avaimella voit tarjota heille enemmän:

* **Google Maps -avain** näyttää kartan, jossa jokaisella noutopisteellä on oma neulansa, sekä [kassan noutopisteen valitsimessa](https://www.zippendo.com/docs/fi/tutorials/shopify-service-point-picker.md) että [ostoskorin noutopisteen valitsimessa](https://www.zippendo.com/docs/fi/tutorials/shopify-cart-service-points.md).
* **Google-avain osoitehakuun** antaa asiakkaiden hakea kassalla mitä tahansa osoitetta tai aluetta ja siirtää karttaa nähdäkseen siellä olevat noutopisteet.

Molemmat avaimet ovat valinnaisia, ja voit lisätä myös vain toisen niistä. Ilman niitä kaikki toimii silti luettelon avulla. Avainten luominen Google Cloud -palvelussa vie noin 15 minuuttia, ja tämä sivu opastaa sinut jokaisen napsautuksen läpi.

> [!NOTE]
>
> **Mitä tarvitset**
>
> * Noutopisteen valitsin otettuna käyttöön Shopify-kassalla tai noutopisteet otettuina käyttöön ostoskorissa. Katso [Lisää noutopisteen valitsin Shopify-kassalle](https://www.zippendo.com/docs/fi/tutorials/shopify-service-point-picker.md) tai [Anna asiakkaiden valita noutopiste Shopify-kaupan ostoskorissa](https://www.zippendo.com/docs/fi/tutorials/shopify-cart-service-points.md).
> * Google-tili.
> * Maksukortti. Google pyytää sinua määrittämään laskutuksen ennen kuin Google-avain toimii, myös silloin, kun pysyt kuukausittaisen ilmaisen käytön rajoissa.

## Mitä se maksaa

Google antaa sinulle joka kuukausi tietyn määrän ilmaista käyttöä ja veloittaa sen ylittävästä käytöstä. Kartan kohdalla lasketaan jokainen kerta, kun asiakas avaa sen. Osoitehaun kohdalla lasketaan jokainen haku ja jokainen kerta, kun asiakas siirtää karttaa. Google ilmoittaa ajantasaiset hintansa sivulla [Google Maps Platform -hinnoittelu](https://mapsplatform.google.com/pricing/). Google Cloud -palvelussa voit asettaa budjettihälytyksen, jolloin Google lähettää sinulle sähköpostia, ennen kuin lasku kasvaa. Budjettihälytys ei kuitenkaan pysäytä veloituksia: jos haluat rajata osoitehaun kustannukset, aseta Geocoding API:lle lisäksi päivittäinen pyyntöraja (kiintiö).

## Vaihe 1: Luo projekti Google Cloud -palvelussa

**1. Kirjaudu Google Cloud -palveluun**

Siirry osoitteeseen [console.cloud.google.com](https://console.cloud.google.com) ja kirjaudu sisään Google-tililläsi.

**2. Luo projekti**

Luo uusi projekti ja anna sille nimi, jonka tunnistat, esimerkiksi "Verkkokaupan kartta".

**3. Määritä laskutus**

Kun Google pyytää, lisää laskutustili maksukortillasi.

## Vaihe 2: Ota rajapinnat käyttöön

Avaa projektissasi **Google Maps Platform** ja ota käyttöön (enable) nämä kaksi:

* **Maps JavaScript API**: näyttää kartan verkkosivulla, esimerkiksi kassallasi.
* **Geocoding API**: antaa asiakkaiden hakea osoitetta tai aluetta ja siirtää karttaa nähdäkseen siellä olevat noutopisteet.

## Vaihe 3: Luo kartta-avain ja lukitse se verkkokauppaasi

Avaa **Google Maps Platform** -osiossa **Keys & Credentials**, napsauta **Create credentials** ja valitse **API key**. Google näyttää uuden avaimesi: pitkän koodin, joka alkaa kirjaimilla "AIza". Kopioi se.

Avain, jota ei ole lukittu, toimii millä tahansa verkkosivustolla, joten joku muu voisi käyttää sitä ja sinä maksaisit hänen karttansa. Lukitse se osoitteisiin, joilla asiakkaasi maksavat tilauksensa.

**1. Avaa avaimen asetukset**

Napsauta uuden avaimesi nimeä.

**2. Salli vain verkkokauppasi osoitteet**

Valitse kohdassa **Application restrictions** vaihtoehto **Websites**. Lisää kohtaan **Website restrictions** jokainen osoite, jolla asiakkaasi maksavat tilauksensa, yksi kerrallaan:

* Oma verkkotunnuksesi, esimerkiksi `https://nordlysliving.dk/*`, ja sama osoite niin, että alussa on `*.`, esimerkiksi `https://*.nordlysliving.dk/*`, jotta myös osoitteet kuten [www](http://www). ja checkout. ovat mukana.
* Shopify-osoitteesi, esimerkiksi `https://nordlys-living.myshopify.com/*`.
* `https://shop.app/*`, jos otit valitsimelle käyttöön asetuksen **Include block in Shop Pay**.

**3. Salli vain kartta**

Valitse kohdassa **API restrictions** vaihtoehto **Restrict key** ja rastita vain **Maps JavaScript API**.

**4. Tallenna**

Napsauta **Save**. Voi kestää muutaman minuutin, ennen kuin uudet rajoitukset tulevat voimaan.

> [!TIP]
>
> Etkö ole varma, mitä osoitetta kassasi käyttää? Aloita kassa verkkokaupassasi ja katso selaimesi osoiteriviä. Sen osoitteen on oltava luettelossa.

## Vaihe 4: Luo osoitehaun avain

Osoitehaku tarvitsee toisen avaimen. Toisin kuin kartta-avainta, sitä ei saa lukita verkkosivustoihin, muuten osoitehaku ei toimi.

**1. Luo toinen avain**

Napsauta kohdassa **Keys & Credentials** painiketta **Create credentials** ja valitse jälleen **API key**. Kopioi uusi avain.

**2. Salli vain osoitehaku**

Napsauta uuden avaimen nimeä. Valitse kohdassa **API restrictions** vaihtoehto **Restrict key** ja rastita vain **Geocoding API**.

**3. Jätä verkkosivustot rajaamatta**

Valitse kohdassa **Application restrictions** vaihtoehto **None**. Koska avain sallii vain Geocoding API:n, kukaan ei voi käyttää sitä karttojen näyttämiseen.

**4. Tallenna**

Napsauta **Save**.

> [!WARNING]
>
> Käytä kahta eri avainta. Osoitehaku ei toimi avaimella, joka on lukittu verkkosivustoihin, joten yksi avain ei voi hoitaa molempia.

Google nimeää valikkojaan välillä uudelleen. Jos jokin tässä mainittu nimi ei vastaa näkymääsi, ajantasaiset vaiheet löytyvät Google-ohjeesta [Use API keys](https://developers.google.com/maps/documentation/javascript/get-api-key).

## Vaihe 5: Lisää avaimet Zippendo-sovellukseen

**1. Avaa verkkokauppasi**

Napsauta sivupalkissa **Myyntikanavat**. Napsauta **Yhdistetyt**-välilehdellä Shopify-verkkokauppaasi. Päädyt **Tilaukset ja kassa** -välilehdelle.

**2. Liitä kartta-avain**

Liitä kartta-avain **Noutopisteet kassalla** -kortin tai **Noutopisteet ostoskorissa** -kortin kenttään **Google Maps -avain (valinnainen)** ja napsauta **Tallenna avain**. Näet viestin **Google-avain tallennettu**. Molemmat kortit käyttävät samoja avaimia, joten lisäät ne vain kerran.

**3. Liitä osoitehaun avain**

Liitä toinen avain **Noutopisteet kassalla** -kortin kenttään **Google-avain osoitehakuun (valinnainen)** ja napsauta **Tallenna avain**. Jos Google hyväksyy avaimen, näet viestin **Google-avain tallennettu**, ja kentässä lukee **Avain on tallennettu. Liitä uusi avain korvataksesi sen.** Ostoskorissa ei ole osoitehakua, joten sen kortissa näkyy vain kartta-avain.

![Google Maps -avain (valinnainen), jossa on tallennettu avain, ja Google-avain osoitehakuun (valinnainen), jossa lukee Avain on tallennettu. Liitä uusi avain korvataksesi sen. Vieressä ovat painikkeet Tallenna avain ja Poista avain](https://mintcdn.com/zippendo/cPFBHhpG6rolz2WC/images/how-to/google-maps-key/03-zippendo-keys-light.png?fit=max\&auto=format\&n=cPFBHhpG6rolz2WC\&q=85\&s=a54f62e7b8caa8987618d9f4103a1de4)

Kaksi avainkenttää Noutopisteet kassalla -kortissa

Zippendo ei näytä osoitehaun avainta uudelleen, kun olet tallentanut sen. Jos haluat poistaa sen, napsauta **Poista avain**. Jos haluat poistaa kartta-avaimen, tyhjennä sen kenttä ja napsauta **Tallenna avain**.

## Tarkista, että kaikki toimii

Aloita kassa verkkokaupassasi, valitse noutopistetoimitustapasi ja napsauta **Vaihda noutopiste**. Kun osoitehaun avain on lisätty, luettelon yläpuolella olevassa hakukentässä lukee **Osoite, postinumero tai noutopisteen nimi**.

Kun kartta-avain on lisätty, asiakkaasi voivat vaihtaa **Lista**- ja **Kartta**-näkymän välillä. **Kartta** avaa kartan, jolla jokainen noutopiste näkyy neulana, jossa on kuljetusyhtiön logo. Kun myös osoitehaun avain on lisätty, asiakkaat voivat hakea kartan yläpuolella osoitetta tai postinumeroa tai yksinkertaisesti siirtää karttaa, jolloin sen alueen noutopisteet tulevat näkyviin.

![Shopify-kassan Valitse noutopiste -ikkuna, jossa on osoitteen tai postinumeron hakukenttä Kööpenhaminan Google-kartan yläpuolella ja GLS-neula jokaisen noutopisteen kohdalla](https://mintcdn.com/zippendo/cPFBHhpG6rolz2WC/images/how-to/google-maps-key/01-checkout-map.png?fit=max\&auto=format\&n=cPFBHhpG6rolz2WC\&q=85\&s=021bb7eafed15dbd35cdf30f6d44c999)

Kartta, jonka asiakkaasi näkevät, kun he napsauttavat Kartta

Kun asiakkaat napsauttavat neulaa, he näkevät noutopisteen nimen, osoitteen ja aukioloajat. **Valitse**-painikkeella noutopiste valitaan, ja kartta sulkeutuu.

![Kartalla avattu neula, jossa näkyy Silvan Vesterbrogade, Vesterbrogade 10, København V, avoinna ma–su 09:00–19:00, sekä Valitse-painike](https://mintcdn.com/zippendo/cPFBHhpG6rolz2WC/images/how-to/google-maps-key/02-checkout-map-pin.png?fit=max\&auto=format\&n=cPFBHhpG6rolz2WC\&q=85\&s=02c77381f26dc3937ed3cb3ced24dc46)

Napsauta neulaa ja sitten Valitse-painiketta

## Eikö jokin toimi?

* **Karttaa ei näy.** Kopioi kartta-avain uudelleen Google Cloud -palvelusta ja liitä koko avain. Vertaa selaimesi osoiteriviä kassan aikana avaimen kohdan **Website restrictions** osoitteisiin ja tarkista, että Maps JavaScript API on käytössä ja laskutus on määritetty. Kun kassa näyttää toimitustavat ikkunassa sivun päällä, **Kartta**-painiketta ei ole: Shopify ei salli karttaa siinä.
* **Zippendo ilmoittaa: Google ei hyväksynyt tätä avainta.** Osoitehaun avain on lukittu verkkosivustoihin, tai Geocoding API ei ole käytössä sille. Korjaa nämä Google Cloud -palvelussa tai luo uusi avain vaiheen 4 mukaisesti.
* **Asiakkaat eivät voi hakea osoitetta, tai kartan siirtäminen ei tuo näkyviin uusia noutopisteitä.** Tarkista, että tallensit osoitehaun avaimen ja että Geocoding API on yhä käytössä ja laskutus määritetty Google Cloud -projektissasi.
* **Muutit juuri avainta.** Odota muutama minuutti ja yritä uudelleen.

## Kuka näkee mitä

Kartta tulee suoraan Google-palvelusta kartta-avaimellasi. Kun asiakas hakee osoitetta tai siirtää karttaa, Zippendo välittää Google-palveluun osoitehaun avaimellasi sen, mitä hän kirjoitti, tai kohdan kartalla. Molemmat avaimet toimivat oman Google-sopimuksesi mukaisesti, ja Google laskuttaa tiliäsi.

Aiheeseen liittyvää: [Lisää noutopisteen valitsin Shopify-kassalle](https://www.zippendo.com/docs/fi/tutorials/shopify-service-point-picker.md) · [Noutopisteen valitsin kassalla](https://www.zippendo.com/docs/fi/order-channels/shopify-checkout-pickup-picker.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.