Shop Promisen näyttäminen tuotesivullasi

Shop Promise -tunnus näkyy toimituspäivien vieressä ja tuotesivuilla sellaisten soveltuvien toimitusten kohdalla, joiden kotimaan toimituksen arvioitu toimitusaika Yhdysvalloissa on enintään viisi kalenteripäivää. Tämän merkin ansiosta asiakkaat tietävät, että heidän tilaukseensa sisältyy nopea ja luotettava toimitus.

Kun Shop Promise ‑hakemuksesi on hyväksytty, siirry tuotesivulle teemaeditorilla ja varmista, että Shop Promise ‑tunnus näkyy oikein.

Jos tunnus ei näy oikein, sinun on sijoitettava Shop Promise ‑moduuli manuaalisesti.

Shop Promise -moduulin manuaalinen sijoittaminen

Jos hallitset teeman koodin lukemisen ja muokkaamisen, voit tarkistaa muutoskohdat ja päivittää tuotesivun.

Tarkista muutoskohdat

Shop Promise -moduulin koodi täytyy sisällyttää tuotesivun tuotelomakkeeseen. Sen pitäisi näyttää samankaltaiselta kuin tämä: {%- form 'product', product -%}. Shop Promise -moduuli on saatavilla eri sijainneissa teemastasi riippuen. Seuraavat ovat yleisiä sijainteja:

• main-product.liquid
• product-form.liquid
• product-template.liquid
• product.liquid

Vinkki

Jos teeman koodin lukeminen ja muokkaaminen eivät ole sinun osaamisalaasi ja käytät Shopifyn teemaa, saat päivitettyä teemasi ottamalla yhteyttä Shopify-tukeen. Lue lisää Shopifyn suunnittelukäytännöstä. Jos käytät kolmannen osapuolen teemaa, voit ottaa yhteyttä teeman kehittäjään tai palkata Shopify Partnerin.

Tuotesivun päivittäminen

Vinkki

Ennen kuin teet mitään muutoksia, kopioi teemasi ja tee muutokset kaksoiskappaleeseen, jotta voit helposti kumota tekemäsi muutokset.

Ohjeet:

Tietokone

1. Siirry Shopify Adminissa kohtaan Verkkosivu > Teemat.

2. Etsi muokattava teema ja klikkaa -kuvaketta avataksesi toimintovalikon, ja klikkaa sitten Muokkaa koodia.

3. Avaa asiaankuuluva tiedosto.

4. Etsi rivi, joka sisältää seuraavan: {%- if block.settings.show_dynamic_checkout -%} tai {{ form | payment_button }}.

5. Luo uusi rivi suoraan alle {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} ja liitä seuraava kyseiselle riville:

<div class="delivery-promise__promise-container"></div>

1. Klikkaa Tallenna.

Lopputuloksen pitäisi näyttää samankaltaiselta kuin seuraava:

{%- if block.settings.show_dynamic_checkout -%}
  {{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>

iPhone

1. Napauta Shopify-sovelluksessa . .
2. Napauta myyntikanavat -osiossa Verkkokauppa.
3. Napauta Hallitse teemoja.
4. Etsi teema, jota haluat muokata, avaa toimintovalikko napauttamalla ...-painiketta ja napauta sitten Muokkaa koodia.
5. Avaa asiaankuuluva tiedosto.
6. Etsi rivi, joka sisältää seuraavan: {%- if block.settings.show_dynamic_checkout -%} tai {{ form | payment_button }}.
7. Luo uusi rivi suoraan alle {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} ja liitä seuraava kyseiselle riville:

<div class="delivery-promise__promise-container"></div>

1. Napauta Tallenna.

Lopputuloksen pitäisi näyttää samankaltaiselta kuin seuraava:

{%- if block.settings.show_dynamic_checkout -%}
  {{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>

Android

1. Napauta Shopify-sovelluksessa . .
2. Napauta myyntikanavat -osiossa Verkkokauppa.
3. Napauta Hallitse teemoja.
4. Etsi teema, jota haluat muokata, avaa toimintovalikko napauttamalla ...-painiketta ja napauta sitten Muokkaa koodia.
5. Avaa asiaankuuluva tiedosto.
6. Etsi rivi, joka sisältää seuraavan: {%- if block.settings.show_dynamic_checkout -%} tai {{ form | payment_button }}.
7. Luo uusi rivi suoraan alle {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} ja liitä seuraava kyseiselle riville:

<div class="delivery-promise__promise-container"></div>

1. Napauta ✓.

Lopputuloksen pitäisi näyttää samankaltaiselta kuin seuraava:

{%- if block.settings.show_dynamic_checkout -%}
  {{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>

Shop Promise -moduulin teeman ohittaminen manuaalisesti

Shop Promise -moduulissa on tumma ja vaalea teema. Moduulissa käytetään automaattisesti sitä teemaa, jolla on korkein kontrastisuhde verrattuna tuotesivun taustaväriin.

Jos osaat lukea ja muokata teemakoodia, voit ohittaa moduulin valitun teeman lisäämällä ankkurielementtiin tietomääritteen, jota käytetään Shop Promise -moduulin manuaaliseen määrittämiseen.

Ennen kuin teet muutoksia, monista teemasi ja muokkaa teeman kaksoiskappaletta, jotta voit helposti palauttaa muutokset.

Vinkki

Jos teeman koodin lukeminen ja muokkaaminen eivät ole sinun osaamisalaasi ja käytät Shopifyn teemaa, saat päivitettyä teemasi ottamalla yhteyttä Shopify-tukeen. Lue lisää Shopifyn suunnittelukäytännöstä. Jos käytät kolmannen osapuolen teemaa, voit ottaa yhteyttä teeman kehittäjään tai palkata Shopify Partnerin.

Ohjeet:

Tietokone

1. Aseta Shop Promise -moduuli manuaalisesti tuotesivullesi ohjeiden mukaan ja jätä sen jälkeen teemaeditori auki.
2. Lisää teeman tietomäärite juuri luotuun ankkurielementtiin, joka on määritetty tummaksi tai vaaleaksi.
3. Klikkaa Tallenna.

Lopputuloksen pitäisi näyttää samankaltaiselta kuin yksi seuraavista:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Tai

<div class="delivery-promise__promise-container" data-theme="light"></div>

iPhone

1. Aseta Shop Promise -moduuli manuaalisesti tuotesivullesi ohjeiden mukaan ja jätä sen jälkeen teemaeditori auki.
2. Lisää teeman tietomäärite juuri luotuun ankkurielementtiin, joka on määritetty tummaksi tai vaaleaksi.
3. Napauta Tallenna.

Lopputuloksen pitäisi näyttää samankaltaiselta kuin yksi seuraavista:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Tai

<div class="delivery-promise__promise-container" data-theme="light"></div>

Android

1. Aseta Shop Promise -moduuli manuaalisesti tuotesivullesi ohjeiden mukaan ja jätä sen jälkeen teemaeditori auki.
2. Lisää teeman tietomäärite juuri luotuun ankkurielementtiin, joka on määritetty tummaksi tai vaaleaksi.
3. Napauta Tallenna.

Lopputuloksen pitäisi näyttää samankaltaiselta kuin yksi seuraavista:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Tai

<div class="delivery-promise__promise-container" data-theme="light"></div>

Lisää mukautettu HTML tai liquid Promise-moduuliin

Jos teemasi tukee mukautettuja lohkoja, voit käyttää Custom Liquid ‑lohkoa lisätäksesi Shop Promise ‑moduulin tuotesivullesi muokkaamatta teeman koodia.

Vaiheet Promise-moduulin lisäämiseksi Custom Liquid ‑lohkon avulla:

Tietokone

1. Siirry Shopify Adminissa kohtaan Verkkosivu > Teemat.
2. Etsi muokattava teema ja klikkaa Mukauta.
3. Siirry tuotesivulle yläreunan valikkopalkin mallin valitsimella.
4. Etsi sivupalkin valikosta Tuotteen tiedot ‑osio.
5. Valitse Lisää lohko ja valitse Custom Liquid käytettävissä olevien lohkojen luettelosta.
6. Liitä Custom Liquid ‑tekstikenttään seuraava koodi:

<div class="delivery-promise__promise-container"></div>

1. Sijoita lohko vetämällä se haluttuun paikkaan, tavallisesti Osta-painikkeiden lohkon alle.
2. Tallenna muutokset klikkaamalla Tallenna.

Jos haluat määrittää teeman Asetukset (tumma tai vaalea), käytä sen sijaan jotakin seuraavista:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Tai

<div class="delivery-promise__promise-container" data-theme="light"></div>

iPhone

1. Napauta Shopify-sovelluksessa . ja napauta sitten Verkko­kauppa.
2. Napauta Hallitse teemoja.
3. Etsi aktiivinen teemasi ja napauta Mukauta.
4. Siirry tuotesivulle yläreunassa olevalla mallivalitsimella.
5. Napauta Tuotteen tiedot ‑osiota.
6. Napauta Lisää lohko ja valitse Custom Liquid.
7. Liitä Custom Liquid ‑tekstikenttään seuraava koodi:

<div class="delivery-promise__promise-container"></div>

1. Sijoita lohko vetämällä se haluttuun paikkaan, tavallisesti Osta-painikkeiden lohkon alle.
2. Ota muutokset käyttöön valitsemalla Tallenna.

Jos haluat määrittää teeman Asetukset (tumma tai vaalea), käytä sen sijaan jotakin seuraavista:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Tai

<div class="delivery-promise__promise-container" data-theme="light"></div>

Android

1. Napauta Shopify-sovelluksessa . ja napauta sitten Verkko­kauppa.
2. Napauta Hallitse teemoja.
3. Etsi aktiivinen teemasi ja napauta Mukauta.
4. Siirry tuotesivulle yläreunassa olevalla mallivalitsimella.
5. Napauta Tuotteen tiedot ‑osiota.
6. Napauta Lisää lohko ja valitse Custom Liquid.
7. Liitä Custom Liquid ‑tekstikenttään seuraava koodi:

<div class="delivery-promise__promise-container"></div>

1. Sijoita lohko vetämällä se haluttuun paikkaan, tavallisesti Osta-painikkeiden lohkon alle.
2. Ota muutokset käyttöön valitsemalla Tallenna.

Jos haluat määrittää teeman Asetukset (tumma tai vaalea), käytä sen sijaan jotakin seuraavista:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Tai

<div class="delivery-promise__promise-container" data-theme="light"></div>

Vinkki

Kaikki teemat eivät tue Custom Liquid ‑lohkoja. Jos teemassasi ei ole tätä vaihtoehtoa, seuraa Shop Promise ‑moduulin manuaalisen sijoittelun ohjeita muokkaamalla teemakoodiasi.