Vise Shop Promise på produktsiden

Shop Promise-merket vises ved siden av leveringsdatoer og på produktsider for kvalifiserte leveranser som estimeres levert innenlands i USA på fem kalenderdager eller mindre. Dette merket viser kunden at bestillingen inkluderer rask og pålitelig leveranse.

Når søknaden din til Shop Promise godkjennes, kan du gå til produktsiden i temaredigeringsprogrammet for å kontrollere at Shop Promise-merket vises riktig.

Hvis merket ikke vises riktig må du plassere Shop Promise-modulen manuelt.

Manuell plassering av Shop Promise-modulen

Hvis du er komfortabel med å lese og redigere temakode kan du identifisere hvor du må gjøre endringer og oppdatere produktsiden.

Finn ut hvor du må gjøre endringer

Koden for Shop Promise-modulen må inkluderes i produktskjemaet på produktsiden, som skal ligne på {%- form 'product', product -%}. Shop Promise-modulen ligger på ulike steder avhengig av tema. Følgende er vanlige steder:

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

Oppdater produktsiden

Trinn:

Datamaskin
  1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
  2. Finn temaet du vil redigere, klikk på -knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
  3. Åpne den relevante filen.
  4. Finn linjen som inneholder {%- if block.settings.show_dynamic_checkout -%} eller {{ form | payment_button }}.
  5. Opprett en ny linje rett under {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} og lim inn følgende på denne linjen:
<div class="delivery-promise__promise-container"></div>
  1. Klikk på Lagre.

Resultatet bør se omtrent slik ut:

{%- if block.settings.show_dynamic_checkout -%}
  {{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>
iPhone
  1. Trykk på -knappen fra Shopify-appen.
  2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
  3. Trykk på Administrer temaer.
  4. Finn temaet du vil redigere, klikk på -knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
  5. Åpne den relevante filen.
  6. Finn linjen som inneholder {%- if block.settings.show_dynamic_checkout -%} eller {{ form | payment_button }}.
  7. Opprett en ny linje rett under {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} og lim inn følgende på denne linjen:
<div class="delivery-promise__promise-container"></div>
  1. Trykk på Lagre.

Resultatet bør se omtrent slik ut:

{%- if block.settings.show_dynamic_checkout -%}
  {{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>
Android
  1. Trykk på -knappen fra Shopify-appen.
  2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
  3. Trykk på Administrer temaer.
  4. Finn temaet du vil redigere, klikk på -knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
  5. Åpne den relevante filen.
  6. Finn linjen som inneholder {%- if block.settings.show_dynamic_checkout -%} eller {{ form | payment_button }}.
  7. Opprett en ny linje rett under {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} og lim inn følgende på denne linjen:
<div class="delivery-promise__promise-container"></div>
  1. Trykk på Lagre.

Resultatet bør se omtrent slik ut:

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

Overstyre modultemaet for Shop Promise manuelt

Shop Promise-modulen har et mørkt og lyst tema. Modulen bruker automatisk det temaet som har det høyeste kontrastforholdet i forhold til produktsidens bakgrunnsfarge.

Hvis du er komfortabel med å lese og redigere temakoder, kan du overstyre det valgte temaet i modulen ved å legge til et dataattributt i ankerelementet som brukes til å plassere Shop Promise-modulen manuelt.

Før du gjør endringer må du duplisere temaet og redigere det dupliserte temaet slik at du enkelt kan gjenopprette eventuelle endringer.

Trinn:

Datamaskin
  1. Følg instruksjonene for å plassere Shop Promise-moduler manuelt på produktsiden og la temaredigeringsprogrammet være åpent.
  2. Legg til et temadataattributt i det nyopprettede ankerelementet angitt som mørkt eller lyst.
  3. Klikk på Lagre.

Resultatet skal ligne på én av følgende:

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

Eller

<div class="delivery-promise__promise-container" data-theme="light"></div>
iPhone
  1. Følg instruksjonene for å plassere Shop Promise-moduler manuelt på produktsiden og la temaredigeringsprogrammet være åpent.
  2. Legg til et temadataattributt i det nyopprettede ankerelementet angitt som mørkt eller lyst.
  3. Trykk på Lagre.

Resultatet skal ligne på én av følgende:

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

Eller

<div class="delivery-promise__promise-container" data-theme="light"></div>
Android
  1. Følg instruksjonene for å plassere Shop Promise-moduler manuelt på produktsiden og la temaredigeringsprogrammet være åpent.
  2. Legg til et temadataattributt i det nyopprettede ankerelementet angitt som mørkt eller lyst.
  3. Trykk på Lagre.

Resultatet skal ligne på én av følgende:

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

Eller

<div class="delivery-promise__promise-container" data-theme="light"></div>
Finner du ikke svarene du leter etter? Vi er her for å hjelpe deg.