Vise Shop Promise på produktsiden
Shop Promise-merket vises ved siden av leveringsdatoer og på produktsider for kvalifiserte leveringer som anslås å bli levert innenriks i USA på fem eller færre kalenderdager. Dette merket lar kundene vite at bestillingen deres inkluderer rask og pålitelig levering.
Når du har aktivert Shop Promise, bør du navigere til produktsiden ved hjelp av temaredigeringsprogrammet for å bekrefte at Shop Promise-merket vises riktig.
Hvis merket ikke vises riktig, må du sørge for at butikken har aktivert akselererte kasseknapper. Du har også flere alternativer for å tilpasse visningen av Shop Promise-merket.
På denne siden
Plasser Shop Promise-modulen manuelt
Hvis du er komfortabel med å lese og redigere temakode, kan du identifisere hvor du skal gjøre endringer og oppdatere produktsiden.
Identifiser hvor du skal gjøre endringer
Koden for Shop Promise-modulen må inkluderes i produktskjemaet på produktsiden, som bør ligne på {%- form 'product', product -%}. Shop Promise-modulen kan finnes på ulike steder avhengig av temaet. Følgende er vanlige steder:
main-product.liquidproduct-form.liquidproduct-template.liquidproduct.liquid
Oppdater produktsiden
Trinn:
Stasjonær datamaskin
Fra Shopify-administrator går du til Nettbutikk > Temaer.
Finn temaet du vil redigere, klikk på
-ikonet for å åpne handlingsmenyen, og klikk deretter på Rediger kode.Åpne den relevante filen.
Finn linjen som inneholder
{%- if block.settings.show_dynamic_checkout -%}eller{{ form | payment_button }}.Opprett en ny linje rett under
{%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%}og lim inn følgende på den linjen:
<div class="delivery-promise__promise-container"></div>- 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>Mobil
Fra Shopify app, trykk på
-ikonet.I seksjonen Salgskanaler, trykk på Nettbutikk > Administrer alle temaer.
Finn temaet du vil redigere, trykk på …-knappen for å åpne handlingsmenyen, og trykk deretter på Rediger kode.
Åpne den relevante filen.
Finn linjen som inneholder
{%- if block.settings.show_dynamic_checkout -%}eller{{ form | payment_button }}.Opprett en ny linje rett under
{%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%}og lim inn følgende på den linjen:
<div class="delivery-promise__promise-container"></div>- Trykk på Lagre eller ✓.
Resultatet bør se omtrent slik ut:
{%- if block.settings.show_dynamic_checkout -%}
{{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>Overstyr temaet for Shop Promise-modulen manuelt
Shop Promise-modulen har et mørkt og et lyst tema. Modulen bruker automatisk det temaet som har høyest kontrastforhold sammenlignet med bakgrunnsfargen på produktsiden.
Hvis du er komfortabel med å lese og redigere temakode, kan du overstyre det valgte temaet for modulen ved å legge til et data-attributt i ankerelementet som brukes til å plassere Shop Promise-modulen manuelt.
Før du gjør noen endringer, bør du duplisere temaet og redigere duplikattemaet, slik at du enkelt kan tilbakestille eventuelle endringer.
Trinn:
Stasjonær datamaskin
- Følg instruksjonene for å plassere Shop Promise-modulen manuelt på produktsiden, og la deretter temaredigeringsprogrammet være åpent.
- Legg til et temadata-attributt i det nyopprettede ankerelementet, satt til dark eller light.
- Klikk på Lagre.
Resultatet bør ligne på ett av følgende:
<div class="delivery-promise__promise-container" data-theme="dark"></div>Eller
<div class="delivery-promise__promise-container" data-theme="light"></div>Mobil
- Følg instruksjonene for å plassere Shop Promise-modulen manuelt på produktsiden, og la deretter temaredigeringsprogrammet være åpent.
- Legg til et temadata-attributt i det nyopprettede ankerelementet, satt til dark eller light.
- Trykk på Lagre.
Resultatet bør ligne på ett av følgende:
<div class="delivery-promise__promise-container" data-theme="dark"></div>Eller
<div class="delivery-promise__promise-container" data-theme="light"></div>Legg til egendefinert HTML eller Liquid for Promise-modulen
Hvis temaet støtter egendefinerte blokker, kan du bruke en egendefinert Liquid-blokk til å legge til Shop Promise-modulen på produktsiden uten å redigere temakoden.
Trinn for å legge til Promise-modulen ved hjelp av en egendefinert Liquid-blokk:
Stasjonær datamaskin
Fra Shopify-administrator går du til Nettbutikk > Temaer.
Finn temaet du vil redigere, og klikk på Rediger tema.
Naviger til en produktside ved hjelp av malvelgeren i den øverste menylinjen.
I sidestolpemenyen finner du Produktinformasjon-seksjonen.
Klikk på Legg til blokk og velg Egendefinert Liquid fra listen over tilgjengelige blokker.
Lim inn følgende kode i tekstfeltet for egendefinert Liquid:
<div class="delivery-promise__promise-container"></div>- Plasser blokken ved å dra den til ønsket plassering, vanligvis under blokken for kjøpsknapper.
- Klikk på Lagre for å bruke endringene.
Hvis du vil angi en temapreferanse (mørkt eller lyst), kan du bruke en av følgende i stedet:
<div class="delivery-promise__promise-container" data-theme="dark"></div>Eller
<div class="delivery-promise__promise-container" data-theme="light"></div>Mobil
Fra Shopify app, trykk på
-ikonet.I seksjonen Salgskanaler, trykk på Nettbutikk > Administrer alle temaer.
Finn det aktive temaet og trykk på Rediger tema.
Naviger til en produktside ved hjelp av malvelgeren øverst.
Trykk på Produktinformasjon-delen.
Trykk på Legg til blokk og velg Egendefinert Liquid.
Lim inn følgende kode i tekstfeltet for egendefinert Liquid:
<div class="delivery-promise__promise-container"></div>- Plasser blokken ved å dra den til ønsket plassering, vanligvis under blokken for kjøpsknapper.
- Trykk på Lagre for å ta i bruk endringene.
Hvis du vil angi en temapreferanse (mørkt eller lyst), kan du bruke en av følgende i stedet:
<div class="delivery-promise__promise-container" data-theme="dark"></div>Eller
<div class="delivery-promise__promise-container" data-theme="light"></div>Støttede språk for Shop Promise-merket
Se tabellen nedenfor for språkene Shop Promise-merket kan vises på. Hvis butikkens språk ikke støttes, vises Shop Promise-merket på engelsk.
| Kinesisk (forenklet) | Kinesisk (tradisjonell) | Kroatisk | Tsjekkisk |
| Dansk | Nederlandsk | Engelsk | Finsk |
| Fransk | Tysk | Gresk | Hindi |
| Ungarsk | Indonesisk | Italiensk | Japansk |
| Koreansk | Litauisk | Malayisk | Norsk (bokmål) |
| Polsk | Portugisisk (Brasil) | Portugisisk (Portugal) | Rumensk |
| Russisk | Slovakisk | Slovensk | Spansk |
| Svensk | Thai | Tyrkisk | Vietnamesisk |