> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.hoppyapps.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# 📍 Come posizionare la barra di spedizione gratuita in una posizione personalizzata

> ℹ️ **Note:** Questo articolo è stato tradotto automaticamente utilizzando AI e può contenere imprecisioni. Se qualcosa sembra sbagliato, si prega di contattare il nostro team di supporto.

Hoppy Free Shipping offre due tipi di posizionamento principali per la barra di spedizione gratuita:

*   📌 Punti di default
*   🧩 Posizionamenti personalizzati

Nella maggior parte dei casi, le aree di collocamento di default funzionano perfettamente bene.

Tuttavia, a volte i commercianti possono desiderare una maggiore flessibilità e preferiscono posizionare la barra di spedizione gratuita in una posizione completamente personalizzata a seconda del layout del negozio.

Questo è esattamente dove **Posizione personalizzata** caratteristica diventa utile ✨

Utilizzando posizione personalizzata, la barra di spedizione gratuita può essere posizionata:

*   Dentro Shopify Blocchi app
*   All'interno di sezioni liquide personalizzate
*   File di tema
*   All'interno controllati manualmente le posizioni

Questa documentazione spiega come attivare correttamente la posizione personalizzata e come posizionare la barra di spedizione gratuita utilizzando entrambi i metodi disponibili.

---

# **⚠️ Comprensione delle differenze di flusso di lavoro**

Il comportamento della posizione personalizzata dipende dal tipo di flusso di lavoro selezionato durante la creazione della configurazione Free Shipping Upsell.

---

# **🎯 Sulla base degli obiettivi (posizione multipla)**

The **Sulla base degli obiettivi** il flusso di lavoro include più aree di collocamento:

*   Pagina del prodotto
*   Cassetto portaoggetti
*   Pagina del carrello
*   Banner

Per questo flusso di lavoro:

→ Aprire la scheda di posizionamento che si desidera personalizzare  
→ Cambiare il suo posizionamento a **Posizione personalizzata**

Una volta abilitato:

→ **Codice della barra di spedizione Snippet** diventa disponibile

⚠️ Importante:

La scheda di collocamento deve essere effettivamente cambiata **Posizione personalizzata**.

Altrimenti, la barra di spedizione gratuita continuerà a utilizzare il comportamento di posizionamento predefinito.

---

# **📍 Sulla base del posizionamento (posizione singola)**

The **Sulla base del posizionamento** il flusso di lavoro controlla solo un'area di collocamento.

Per questo flusso di lavoro, due metodi di posizione personalizzata diventano disponibili:

1.  🆔 ID della barra di trasporto
2.  🧩 Codice della barra di spedizione Snippet

---

## **🆔 ID della barra di trasporto**

Questo metodo viene utilizzato principalmente con Shopify Blocchi app.

L'ID della barra di spedizione collega il blocco dell'app storefront con la configurazione di spedizione gratuita selezionata.

---

## **🧩 Codice della barra di spedizione Snippet**

Questo metodo fornisce una flessibilità di posizionamento più avanzata.

Il codice snippet può essere:

*   Aggiunto all'interno di un blocco liquido personalizzato
*   Aggiunto direttamente in Shopify File di tema

---

# **🛠️ Fase 1 — Apri Hoppy Free Shipping**

Aprire **Hoppy Free Shipping** app dalla tua Shopify Admin.

---

# **📂 Passo 2 — Aprire o creare una spedizione gratuita**

Puoi anche:

→ Aprire una configurazione Free Shipping Upsell esistente  
→ O creare una nuova configurazione

---

# **⚙️ Passo 3 — Passare alle impostazioni di posizionamento**

Il passo successivo dipende dal tipo di flusso di lavoro attualmente in uso.

---

## **🎯 Sulla base del flusso di lavoro degli obiettivi**

Se stai usando **Sulla base degli obiettivi** flusso di lavoro:

→ Aprire la scheda di posizionamento in cui si desidera posizionare manualmente la barra di spedizione gratuita

Esempi:

*   Pagina del prodotto
*   Cassetto portaoggetti
*   Pagina del carrello
*   Banner

---

## **📍 Sulla base del flusso di lavoro di posizionamento**

Se stai usando **Sulla base del posizionamento** flusso di lavoro:

→ Navigare direttamente al **Luogo** scheda

Poiché questo flusso di lavoro controlla solo un posizionamento, tutte le impostazioni relative al posizionamento verranno visualizzate lì.

---

# **🎯 Fase 4 — Cambia posizione in posizione personalizzata**

All'interno delle impostazioni di Posizionamento:

→ Cambiare **Visualizza su (Incluso)** o **Luogo** opzione a:

**Posizione personalizzata**

Allora:

→ Cliccare **Salva**

⚠️ Importante:

Attivare la posizione personalizzata rimuove la barra di spedizione gratuita dalle aree di posizionamento predefinite.

La barra di spedizione gratuita ora apparirà solo dove si posiziona manualmente.

ℹ️ Se si utilizza **Sulla base degli obiettivi** flusso di lavoro, vai a **Metodo 2**.

---

# **🆔 Metodo 1 — Utilizzo dell'ID della barra di trasporto**

Questo metodo è ideale quando si desidera posizionare la barra di spedizione gratuita direttamente utilizzando Shopify’s Theme Editor.

ℹ️ Questo metodo è disponibile principalmente per **Sulla base del posizionamento** flusso di lavoro.

---

# **🎨 Fase 5 — Apri Shopify Tema Editor**

Da Shopify Admin:

→ Vai a **Canali di vendita → Online Store**  
→ Cliccare **Modifica tema**

Questo apre il Shopify Theme Editor.

---

# **➕ Passo 6 — Aggiungi il Blocco di app di spedizione gratuito**

All'interno del Theme Editor:

→ Navigare alla sezione in cui si desidera che la barra di spedizione gratuita venga visualizzata  
→ Passare intorno a sezioni compatibili fino al colore blu ➕ icona appare  
→ Cliccare **Aggiungi blocco**

Allora:

→ Aprire il **Apps** categoria  
→ Selezionare **Spedizione gratuita**

Il Blocco App verrà ora aggiunto all'area riservata selezionata.

---

# **🔗 Passo 7 — Aggiungi l'ID della barra di trasporto**

Una volta aggiunto l'App Block:

→ Inserisci l'ID della barra di spedizione all'interno delle impostazioni del blocco dell'app

Allora:

→ Salvare il Shopify Tema  
→ Salvare la configurazione di Spedizione gratuita all'interno Hoppy Free Shipping così come

⚠️ Importante:

Entrambi i risparmi sono necessari.

Altrimenti, la barra di spedizione gratuita potrebbe non apparire correttamente sul negozio.

---

# **🧩 Metodo 2 — Utilizzo del codice della barra di trasporto Snippet**

Questo metodo è utile quando si desidera una maggiore flessibilità di posizionamento avanzata.

La spedizione Bar Codice Snippet può essere:

*   Aggiunto utilizzando un blocco liquido personalizzato
*   Aggiunto direttamente in Shopify File di tema

ℹ️ Questo è l'unico metodo di posizione personalizzata disponibile per **Sulla base degli obiettivi** flusso di lavoro.

---

# **➕ Passo 8 — Aggiungere un blocco liquido personalizzato**

Dentro Shopify Tema Editor:

→ Navigare nella zona in cui si desidera che la barra di spedizione gratuita venga visualizzata  
→ Passare intorno a sezioni compatibili fino al colore blu ➕ icona appare  
→ Ricerca per **Liquido personalizzato**

Allora:

→ Aggiungi il codice della barra di spedizione Snippet all'interno del blocco liquido personalizzato

Questo consente alla Free Shipping Bar di rendere nella posizione di storefront selezionata.

---

# **💻 Aggiungere il codice Snippet direttamente in file tema**

Se necessario, il Shipping Bar Code Snippet può anche essere aggiunto direttamente in Shopify File di codice tema.

Questo è utile quando:

*   Blocchi app non sono disponibili
*   Le sezioni liquide personalizzate non sono supportate
*   Personalizzazione avanzata del negozio è necessario

---

# **⚙️ Apertura Shopify Codice Editore**

Per aprire il Shopify Codice Editore:

→ Vai a **Canali di vendita → Online Store**  
→ Fare clic sul menu a tre punti accanto al **Modifica tema** pulsante pulsante  
→ Cliccare **Modifica del codice**

⚠️ Importante:

Non consigliamo di modificare Shopify File tema a meno che:

*   Sei comodo lavorare con Shopify codice
*   O capisci quali cambiamenti sono fatti

Modifiche non corrette all'interno I file tema possono influenzare il comportamento di negozio.

---

# **🧩 Identificare l'Area Corsa**

Prima di inserire il Shipping Bar Code Snippet, è importante identificare l'esatta posizione di negozio in cui dovrebbe apparire la barra di spedizione gratuita.

Un modo semplice per farlo:

→ Apri il tuo negozio nel browser  
→ Fare clic con il tasto destro vicino alla zona dove si desidera la barra di spedizione gratuita  
→ Cliccare **Controllo**

Questo apre il browser Strumenti di sviluppo.

Da lì:

→ Ispezionare la struttura HTML circostante  
→ Identificare nomi di classe utili o riferimenti di sezione  
→ Abbina quelle sezioni con la corrispondente Shopify `.liquid` file nel Codice Editor

# Questo ti aiuta a individuare il file Teme corretto più accuratamente ✨

# \---

# **🔍 Trovare il file tema corretto**

Dopo l'apertura Shopify Codice Editore:

→ Navigare attraverso i file Tema sul lato sinistro  
→ Individuare il `.liquid` responsabile per l'area in cui si desidera che la barra di spedizione gratuita venga visualizzata  
→ Cercare qualsiasi riferimento id/class utilizzando la funzione di ricerca del Code Editor.  
→ Clicca sul più promettente `.liquid` file

Per esempio:

*   Le sezioni relative al prodotto possono esistere all'interno:
    *   `main-product.liquid`
    *   `product-template.liquid`
*   Le sezioni relative al carrello possono esistere all'interno:
    *   `cart.liquid`
    *   `cart-drawer.liquid`
*   Le sezioni personalizzate possono esistere all'interno:
    *   `sections/*.liquid`

---

# **➕ Aggiungi il codice della barra di spedizione Snippet**

Una volta corretto `.liquid` il file è identificato:

→ Incolla il codice della barra di spedizione Snippet nella posizione desiderata all'interno del file

⚠️ Importante:

Assicurarsi che lo snippet venga aggiunto con attenzione nella posizione corretta.

Il posizionamento non corretto può causare:

*   Questioni di layout
*   rendering improprio
*   Comportamento di vetrina inaspettato

---

# **💾 Salvare il file tema**

Dopo aver inserito il codice snippet:

→ Cliccare **Salva**

Allora:

→ Aggiornare l'anteprima del negozio  
→ Verificare che la barra di spedizione gratuita appare correttamente nella posizione personalizzata selezionata ✨

---

# **🎉 Risultato finale**

Una volta configurato con successo:

✅ La barra di spedizione gratuita può apparire in posizioni di negozio completamente personalizzate  
✅ Shopify Blocchi app possono connettersi correttamente utilizzando l'ID della barra di trasporto  
✅ Il posizionamento avanzato del negozio diventa possibile utilizzando Code Snippets  
✅ I commercianti guadagnano molta più flessibilità rispetto alla visibilità del negozio ✨