Visualizzazione di Shop Promise sulla pagina del prodotto
Il badge Shop Promise viene visualizzato accanto alle date di consegna e sulle pagine dei prodotti per le consegne idonee la cui consegna è stimata a livello nazionale negli Stati Uniti in cinque o meno giorni di calendario. Questo badge consente ai clienti di sapere che il loro ordine include una consegna rapida e affidabile.
Dopo aver attivato Shop Promise, vai alla pagina del prodotto utilizzando l’editor del tema per verificare che il badge Shop Promise venga visualizzato correttamente.
Se il badge non viene visualizzato correttamente, assicurati che nel negozio siano attivati i pulsanti di check-out rapido. Hai anche diverse opzioni per personalizzare la visualizzazione del badge Shop Promise.
In questa pagina
Posiziona manualmente il modulo Shop Promise
Se hai dimestichezza con la lettura e la modifica del codice del tema, puoi identificare dove apportare le modifiche e aggiornare la pagina del prodotto.
Identifica dove apportare le modifiche
Il codice per il modulo Shop Promise deve essere incluso nel modulo del prodotto sulla pagina del prodotto, che dovrebbe essere simile a {%- form 'product', product -%}. Il modulo Shop Promise può essere trovato in varie posizioni a seconda del tema. Di seguito sono riportate le posizioni comuni:
main-product.liquidproduct-form.liquidproduct-template.liquidproduct.liquid
Aggiorna la pagina del prodotto
Passaggi:
Desktop
Dal pannello di controllo Shopify, vai a Negozio online > Temi.
Trova il tema che desideri modificare, clicca sull’icona
per aprire il menu delle azioni, quindi clicca su Modifica codice.Apri il file pertinente.
Trova la riga che contiene
{%- if block.settings.show_dynamic_checkout -%}o{{ form | payment_button }}.Crea una nuova riga direttamente sotto
{%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%}e incolla quanto segue su quella riga:
<div class="delivery-promise__promise-container"></div>- Clicca su Salva.
Il risultato dovrebbe essere simile al seguente:
{%- if block.settings.show_dynamic_checkout -%}
{{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>Mobile
Dall'app Shopify, tocca l'icona
.Nella sezione Canali di vendita, tocca Negozio online > Gestisci tutti i temi.
Trova il tema che desideri modificare, tocca il pulsante con i ... per aprire il menu delle azioni, quindi tocca Modifica codice.
Apri il file pertinente.
Trova la riga che contiene
{%- if block.settings.show_dynamic_checkout -%}o{{ form | payment_button }}.Crea una nuova riga direttamente sotto
{%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%}e incolla quanto segue su quella riga:
<div class="delivery-promise__promise-container"></div>- Tocca Salva o ✓.
Il risultato dovrebbe essere simile al seguente:
{%- if block.settings.show_dynamic_checkout -%}
{{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>Sostituisci manualmente il tema del modulo Shop Promise
Il modulo Shop Promise ha un tema scuro e uno chiaro. Il modulo utilizza automaticamente il tema con il rapporto di contrasto più elevato rispetto al colore di sfondo della pagina del prodotto.
Se hai dimestichezza con la lettura e la modifica del codice del tema, puoi sostituire il tema selezionato del modulo aggiungendo un attributo dati all’elemento di ancoraggio utilizzato per posizionare manualmente il modulo Shop Promise.
Prima di apportare modifiche, duplica il tema e modifica il tema duplicato in modo da poter annullare facilmente le modifiche.
Passaggi:
Desktop
- Segui le istruzioni per posizionare manualmente il modulo Shop Promise sulla pagina del prodotto, quindi lascia aperto l’editor del tema.
- Aggiungi un attributo dati del tema all’elemento di ancoraggio appena creato, impostandolo su scuro o chiaro.
- Clicca su Salva.
Il risultato dovrebbe essere simile a uno dei seguenti:
<div class="delivery-promise__promise-container" data-theme="dark"></div>Oppure
<div class="delivery-promise__promise-container" data-theme="light"></div>Mobile
- Segui le istruzioni per posizionare manualmente il modulo Shop Promise sulla pagina del prodotto, quindi lascia aperto l’editor del tema.
- Aggiungi un attributo dati del tema all’elemento di ancoraggio appena creato, impostandolo su scuro o chiaro.
- Tocca Salva.
Il risultato dovrebbe essere simile a uno dei seguenti:
<div class="delivery-promise__promise-container" data-theme="dark"></div>Oppure
<div class="delivery-promise__promise-container" data-theme="light"></div>Aggiungi HTML o Liquid personalizzato per il modulo Promise
Se il tema supporta i blocchi personalizzati, puoi utilizzare un blocco Liquid personalizzato per aggiungere il modulo Shop Promise alla pagina del prodotto senza modificare il codice del tema.
Passaggi per aggiungere il modulo Promise utilizzando un blocco Liquid personalizzato:
Desktop
Dal pannello di controllo Shopify, vai a Negozio online > Temi.
Trova il tema che desideri modificare e clicca su Modifica tema.
Vai a una pagina del prodotto utilizzando il selettore del modello nella barra dei menu in alto.
Nel menu della barra laterale, trova la sezione Informazioni sul prodotto.
Clicca su Aggiungi blocco e seleziona Liquid personalizzato dall’elenco dei blocchi disponibili.
Nel campo di testo Liquid personalizzato, incolla il codice seguente:
<div class="delivery-promise__promise-container"></div>- Posiziona il blocco trascinandolo nella posizione desiderata, in genere sotto il blocco dei pulsanti di acquisto.
- Clicca su Salva per applicare le modifiche.
Se desideri specificare una preferenza per il tema (scuro o chiaro), utilizza invece una delle seguenti opzioni:
<div class="delivery-promise__promise-container" data-theme="dark"></div>Oppure
<div class="delivery-promise__promise-container" data-theme="light"></div>Mobile
Dall'app Shopify, tocca l'icona
.Nella sezione Canali di vendita, tocca Negozio online > Gestisci tutti i temi.
Trova il tema attivo e tocca Modifica tema.
Vai a una pagina del prodotto utilizzando il selettore del modello in alto.
Tocca la sezione Informazioni sul prodotto.
Tocca Aggiungi blocco e seleziona Liquid personalizzato.
Nel campo di testo Liquid personalizzato, incolla il codice seguente:
<div class="delivery-promise__promise-container"></div>- Posiziona il blocco trascinandolo nella posizione desiderata, in genere sotto il blocco dei pulsanti di acquisto.
- Tocca Salva per applicare le modifiche.
Se desideri specificare una preferenza per il tema (scuro o chiaro), utilizza invece una delle seguenti opzioni:
<div class="delivery-promise__promise-container" data-theme="dark"></div>Oppure
<div class="delivery-promise__promise-container" data-theme="light"></div>Lingue supportate per il badge Shop Promise
Consulta la tabella seguente per le lingue in cui può essere visualizzato il badge Shop Promise. Se la lingua del tuo negozio non è supportata, il badge Shop Promise viene visualizzato in inglese.
| Cinese (semplificato) | Cinese (tradizionale) | Croato | Ceco |
| Danese | Olandese | Inglese | Finlandese |
| Francese | Tedesco | Greco | Hindi |
| Ungherese | Indonesiano | Italiano | Giapponese |
| Coreano | Lituano | Malese | Norvegese (Bokmål) |
| Polacco | Portoghese (Brasile) | Portoghese (Portogallo) | Rumeno |
| Russo | Slovacco | Sloveno | Spagnolo |
| Svedese | Tailandese | Turco | Vietnamita |