Brändäyseditorin käyttäminen Checkout Blocksissa

Checkout Branding API:in perustuvan Checkout Blocksin brändäyseditorin avulla voit mukauttaa kassa- ja tilisivujen ulkoasua koodia muuttamatta.

Brändäyseditorilla voit muokata minkä tahansa kassakokoonpanon väri- ja kassaelementtejä. Brändäyseditorilla kassan ulkoasuun tehdyt muutokset koskevat kaikkia kassavaiheen sivuja, kuten kiitossivua, tilauksen tila ‑sivua ja uusien asiakastilien sivuja.

Voit avata brändäyseditorin Shopify Aadminista klikkaamalla Myyntikanavat > Checkout Blocks ja klikkaamalla sitten Brändäyseditori.

Kassavaiheen värien mukauttaminen

Värit-osiosta voit mukauttaa kassavaiheen perusvärejä. Jos haluat käyttää useita ulkoasuja, voit myös mukauttaa enintään neljää värimallia, joita sovelletaan yksittäisiin osioihin. Voit muokata värityyppejä, kuten korostusvärejä (vuorovaikutteiset elementit, kuten linkit) ja brändivärejä (ensisijaiset ja toissijaiset painikkeet tms. elementit).

Ohjeet:

Customize global colors
  1. Klikkaa Shopify Adminissa Myyntikanavat > Checkout Blocks.
  2. Klikkaa Brändäyseditori.
  3. Klikkaa Värit-osiosta Yleiset värit.
  4. Jos haluat ohittaa kassavaiheen nykyisen värin, klikkaa Yleiset värit ‑osiosta -kuvaketta ja valitse haluamasi väri jommallakummalla seuraavista toimenpiteistä:

    • Valitse väri värivalitsimella.
    • Kirjoita HEX-värikoodi kenttään.
  5. Klikkaa Tallenna.

Customize color schemes
  1. Klikkaa Shopify Adminissa Myyntikanavat > Checkout Blocks.
  2. Klikkaa Brändäyseditori.
  3. Mukauta haluaasi värimallia valitsemalla Värit-osiosta Värimalli 1, Värimalli 2, Värimalli 3 tai Värimalli 4.
  4. Valitse jokin seuraavista mukautettavista osista:

    • Päävärit
    • Lomakkeen asetukset
    • Ensisijainen painike
    • Toissijainen painike
  5. Klikkaa Pääväri-osiosta mukautettavan värityypin vierestä -kuvaketta ja valitse haluamasi väri tekemällä jompikumpi seuraavista:

    • Valitse väri värivalitsimella.
    • Kirjoita HEX-värikoodi kenttään.
  6. Valinnainen: Jos muokkaat Lomakkeen asetukset-, Ensisijainen painike- tai Toissijainen painike ‑värimallia, voit myös mukauttaa Valittuna- tai Osoitettuna-vuorovaikutuksen käyttäytymisen värejä. Klikkaa -kuvaketta mukautettavan värityypin vierestä ja valitse haluamasi väri tekemällä jommallakummalla seuraavista:

    • Valitse väri värivalitsimella.
    • Kirjoita HEX-värikoodi kenttään.
  7. Klikkaa Tallenna.

Kassavaiheen elementtien mukauttaminen

Brändäyseditorin Mukautukset-osiosta voit muokata seuraavia kassavaiheen elementtejä:

  • Favicon: Valitse kuvake, joka näkyy asiakkaille selaimen välilehdellä kassavaiheessa.
  • Yleinen: Säädä kaikkien elementtien (lomakesyötteet, painikkeet ja kortit) kulman sädettä.
  • Ylätunniste ja logo: Valitse ylätunnisteen sijainti kassavaiheessa sekä näytetäänkö navigointipolku, ostoskorin linkki ja logo.
  • Pää: Sovella suunnittelumalleja kassavaiheen pääsisältöalueeseen, mukaan lukien taustakuvat, reunaviivan leveys ja värimallit.
  • Tilauksen yhteenveto: Sovella kassavaiheen sivupalkkiin suunnittelumalleja, jotka sisältävät asiakkaan tilauksen yhteenvedon, mukaan lukien taustakuvat, reunaviivan leveys ja värimallit.
  • Alatunniste: Valitse kassavaiheen alatunnisteen leveys ja se, näytetäänkö kaupan käytännöt.
  • Typografia: Valitse fonttikoko, fonttiperhe ja fontin leveys, koko, välistys ja kirjasinkoko enintään kolmelle ylätunnisteiden tasolle.
  • Painikkeet: Valitse ensisijaisten ja toissijaisten painikkeiden ympärysväli, reunat ja tyylit.
  • Lomakkeet: Mukauta kassavaiheen lomakesyötteiden tyylejä, kuten valintaruudut, tekstikentät ja luettelon valintavaihtoehtoja.
  • Tuotteen pikkukuvat: Säädä kassavaiheessa näytettävien tuotekuvien reunaviivaa ja kulman sädettä.

Ohjeet:

  1. Klikkaa Shopify Adminissa Myyntikanavat > Checkout Blocks.
  2. Klikkaa Brändäyseditori.
  3. Klikkaa Mukautukset-osiosta mukautettavia elementtejä, kuten Ylätunniste ja logo.
  4. Säädä kassavaiheen elementtiä haluamasi mukaan mukautusvaihtoehtojen avulla.
  5. Klikkaa Tallenna.

Kassavaiheen määritysten vaihtaminen

Kun avaat brändäyseditorin, muokkaat oletusarvoisesti julkaistua kassavaiheen määritystä. Voit kuitenkin vaihtaa muokattavaa kassavaiheen määritystä brändäyseditorissa sekä luoda uusia kassavaiheen määrityksiä.

Lue lisää julkaistujen ja luonnosteltujen kassavaiheiden määritysten hallinnoinnista.

Ohjeet:

  1. Klikkaa Shopify Adminissa Myyntikanavat > Checkout Blocks.
  2. Klikkaa Brändäyseditori.
  3. Klikkaa nykyisen kassamäärityksen nimeä avataksesi pudotusvalikon, joka sisältää julkaistun kokoonpanon luettelon sekä mahdolliset määritysten luonnokset, ja valitse sitten mukautettava kassavaiheen määritys:
    • Valitse muokattava olemassa oleva määritys.
    • Klikkaa ⊕ Luo uusi määritys, niin sinut uudelleenohjataan Shopify Adminin Kassa-asetuksiin.

Kassan esikatselu

Voit milloin tahansa esikatsella brändäyseditorissa tekemiäsi muutoksia valitsemalla esikatseltavan kassan määrityksen ja valitsemalla sitten Esikatsele. Kassa- ja tilieditori avautuu erilliselle välilehdelle. Esikatselussa näet kaikki tekemäsi muutokset ja sen, miten ne näkyvät kassalla.

Ohjeet:

  1. Klikkaa Shopify Adminissa Myyntikanavat > Checkout Blocks.
  2. Klikkaa Brändäyseditori.
  3. Tee tarvittavat mukautukset kassan määrityksen väreihin tai kassavaiheen elementteihin.
  4. Klikkaa Esikatselu.

Kassan määritysten vieminen ja tuominen

Voit viedä ja tuoda kassan määrityksiä JSON-tiedostojen avulla.

Kassan määrityksen vieminen:

  1. Klikkaa Shopify Adminissa Myyntikanavat > Checkout Blocks.
  2. Klikkaa Brändäyseditori.
  3. Valitse kassan määritys ja siihen sovelletut mukautukset brändäyseditorilla.
  4. Klikkaa Lisää toimintoja > Vie määritys.

Kassan määritys ladataan paikalliselle laitteelle .json-tiedostona.

Tuo kassamääritys:

  1. Klikkaa Shopify Adminissa Myyntikanavat > Checkout Blocks.
  2. Klikkaa Brändäyseditori.
  3. Valitse kassan määritys, johon haluat käyttää tuotua brändäysprofiilia.
  4. Klikkaa Lisää toimintoja > Tuo määritys.
  5. Lataa brändäyksen JSON-tiedosto Tuo kassan brändäys ‑valintaikkunassa:

    1. Klikkaa Add file (Lisää tiedosto) -valintaa.
    2. Valitse sopiva JSON-tiedosto laitteeltasi.
    3. Klikkaa Tuo ja jatka.
  6. Tarkista esiladattu mukautusmääritys. Muokkaa sitä tarvittaessa.

  7. Klikkaa Tallenna.

Kassan oletustyylin palauttaminen

Kun muokkaat väriä tai kassaelementtiä brändäyseditorilla, voit palauttaa haluamasi arvon takaisin oletusarvoon klikkaamalla Palauta muuttamasi värin tai elementin vierestä.

Voit milloin tahansa palauttaa kassan määrityksen koko brändäyksen Shopifyn oletusarvoihin. Kassan määritysten palauttaminen poistaa kaikki mukautukset brändäyseditorin kaikilta sivuilta. Tätä toimintoa ei voi peruuttaa.

Ohjeet:

  1. Klikkaa Shopify Adminissa Myyntikanavat > Checkout Blocks.
  2. Klikkaa Brändäyseditori.
  3. Valitse palautettava kassan määritys.
  4. Klikkaa Palauta oletusarvoon.
  5. Klikkaa Palautetaanko oletustyylit? ‑valintaikkunasta Jatka.
Etkö löydä hakemaasi vastausta? Autamme mielellämme.