ℹ️ 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.

La funzione Posizione personalizzata consente di posizionare il Convertitore di valute esattamente dove lo si desidera sul tuo negozio.

Invece di utilizzare le posizioni di default galleggianti o intestazioni, è possibile collegare il Convertitore di valuta a un elemento specifico all'interno del vostro Shopify tema utilizzando un selettore CSS.

Questo ti dà una maggiore flessibilità e aiuta il Convertitore di valute si fondono naturalmente nel design del tuo negozio. 🎯

⚠️ Prima di iniziare

Prima di impostare una posizione personalizzata, assicurarsi:

• Hoppy Currency Converter è installato e configurato
• L'App Embed è abilitato
• L'imbarco è stato completato
• Sai dove vorresti che il Convertitore di Valuta compaia

💡 Le posizioni comuni includono barre di navigazione, intestazioni, barre laterali, menu di utilità e sezioni di negozio personalizzate.

✅ Passo 1: Aprire le impostazioni di visualizzazione

Aprire Hoppy Currency Converter app dalla tua Shopify Admin.

Allora:

→ Vai a Impostazioni impostazioni

→ Cliccare Visualizza

Individuare entrambi:

• Posizione Desktop
• Posizione mobile

È possibile configurare il posizionamento personalizzato separatamente per dispositivi desktop e mobili.

✅ Passo 2: Selezionare posizione personalizzata

Sotto Posizione Stile, vedrete le opzioni di collocamento disponibili.

Stile di posizione disponibili

Floating

Visualizza il Convertitore di valute come widget galleggiante sul negozio.

Intestazione

Luoghi il Convertitore di valuta all'interno dell'intestazione del negozio.

Posizione personalizzata

Luoghi il Convertitore di valute all'interno di un elemento specifico selezionato da voi.

Seleziona:

→ Posizione personalizzata

Una volta selezionata, le impostazioni aggiuntive diventano disponibili automaticamente.

✅ Passo 3: Inserisci l'elemento di destinazione

All'interno Elemento personalizzato campo, inserire il selettore CSS dell'elemento in cui dovrebbe apparire il Convertitore di valute.

Tipi di selezione supportati

Selezione classe

Inizia con un periodo (.)

Esempio

.header-actions

Selettore ID

Comincia con un hash (#)

Esempio

#currency-wrapper

Selezionatore di elementi

Utilizza il nome dell'elemento HTML direttamente.

Esempio

header

🔍 Come Trovare un Selettore

Se non sei sicuro di quale selettore utilizzare:

1. Apri il tuo negozio.
2. Fare clic con il pulsante destro del mouse sull'area in cui si desidera il Convertitore di valute.
3. Fare clic Controllo.
4. Individuare l'elemento HTML.
5. Fare clic con il tasto destro sull'elemento.
6. Seleziona Copia → Selettore Copia.
7. Incolla il selettore copiato nel Elemento personalizzato campo.

Esempio

#block-template--166120#######__banner_bckcpm-video_CLEttT > div.media-with-text__content.rounded.text-custom > div > a

⚠️ Evitare di usare temporaneamente Shopify- ID generati, come questi possono cambiare dopo aggiornamenti tema.

Utilizzando i nomi di classe stabile è raccomandato ogni volta che possibile.

✅ Passo 4: Scegli posizione

Dopo aver inserito il selettore, scegliere come il Convertitore di valute deve essere inserito rispetto a tale elemento.

Opzioni di posizionamento disponibili

Prima

Luoghi il Convertitore di valute immediatamente prima dell'elemento selezionato.

Esempio

Se si mira un'icona del carrello:

→ Il Convertitore di valute appare a sinistra dell'icona del carrello.

Dopo

Luoghi il Convertitore di valute immediatamente dopo l'elemento selezionato.

Esempio

Se si mira un logo:

→ Il Convertitore di valute appare a destra del logo.

Allegato

Luoghi il Convertitore di valuta all'interno dell'elemento selezionato, alla fine.

Esempio

Se si mira un contenitore di navigazione:

→ Il Convertitore di valute appare dopo tutti gli elementi di navigazione esistenti.

💡 Questa è spesso l'opzione migliore di partenza per la maggior parte dei temi.

Prependenza

Luoghi il Convertitore di valuta all'interno dell'elemento selezionato, all'inizio.

Esempio

Se si mira un contenitore di navigazione:

→ Il Convertitore di valute appare prima di tutti gli elementi di navigazione esistenti.

✅ Passo 5: Salva le tue modifiche

Una volta configurata l'opzione di selezione e collocamento:

→ Cliccare Salva

Il Convertitore di valute ora cercherà di rendere nella posizione selezionata.

✅ Passo 6: Verificare il posizionamento

Visita il tuo negozio e conferma che il Convertitore valuta appare nella posizione desiderata.

Se non appare:

• Verificare che il selettore sia corretto
• Confermare che l'elemento esiste nella pagina
• Prova un'opzione di posizionamento diversa
• Aggiorna la pagina

💡 Un rinfresco duro è spesso utile dopo aver apportato modifiche al posizionamento.

🛠️ Metodo alternativo: Posizionamento manuale

Se si utilizza un selettore CSS non è adatto per il vostro tema, è possibile posizionare manualmente il Convertitore di valute utilizzando il suo codice snippet.

Questo metodo è utile quando:

• Si desidera il controllo completo su dove appare il Convertitore di valute.
• Il vostro tema non contiene un elemento adatto per bersaglio con Posizione personalizzata.
• Sei a tuo agio a fare personalizzazione a tema minore.

Passo 1: Copia il codice del convertitore di valuta Snippet

Aprire Hoppy Currency Converter app dalla tua Shopify Admin.

Allora:

→ Vai a Avanzato

Ricerca:

→ Convertitore di valuta

Copiare i frammenti di codice forniti dalla nostra app o sotto:

<div class="futureblink-currency-box"></div>

Questo è lo snippet che si posiziona ovunque si desidera che il Convertitore di valuta per apparire.

Passo 2: Aggiungi il Snippet al tuo tema

Opzione A — Utilizzo di un blocco liquido personalizzato

Dal Shopify Tema Editor:

→ Passare alla sezione dove si desidera che il Convertitore di valuta per apparire.

→ Fare clic su ➕ Aggiungi blocco Pulsante.

→ Cercare e aggiungere un Liquido personalizzato blocco.

→ Incolla il codice del convertitore di valuta Snippet nel blocco liquido personalizzato.

→ Cliccare Salva.

Opzione B — Modifica dei file tematici

Per la personalizzazione avanzata del negozio, è anche possibile aggiungere lo stesso codice snippet direttamente al vostro Shopify file tematici.

Vai a:

Online Store → Temi

→ Fare clic su Impossibile. menu accanto Modifica tema

→ Selezionare Modifica del codice

Individuare l'appropriato .liquid file per la sezione in cui si desidera visualizzare il Convertitore di valuta, quindi incollare il Convertitore di valuta Snippet nel percorso desiderato.

⚠️ Importante:

Questo metodo è destinato per i commercianti montaggio confortevole Shopify codice tema. Si consiglia di duplicare il tema prima di apportare modifiche, in quanto le modifiche errate possono influenzare il layout del negozio o la funzionalità.

Selettore deve esistere sulla pagina

Se l'elemento selezionato esiste solo su alcune pagine, il Convertitore di valute apparirà solo su quelle pagine.

Utilizzando intestazione globale o selettori di navigazione di solito fornisce i migliori risultati.

Elementi nascosti Nascondi il Convertitore

Se l'elemento selezionato è nascosto dal tema su alcuni dispositivi, il Convertitore di valute sarà anche nascosto.

Sempre testare sia i layout desktop che mobili.

Puoi tornare quando vuoi

Se la posizione personalizzata non è più necessaria:

→ Torna a Visualizza impostazioni

→ Cambiamento Posizione Stile a:

• Floating
• Intestazione

Non è richiesta alcuna configurazione aggiuntiva.

🎉 Risultato finale

Una volta configurato con successo:

✅ Il Convertitore di Valuta appare esattamente dove lo vuoi

✅ I layout desktop e mobili possono utilizzare diversi posizionamenti

✅ Il widget si fonde naturalmente nel tuo design storefront

✅ Il posizionamento può essere regolato senza modificare i file tema

✅ I commercianti avanzati possono posizionare manualmente il convertitore utilizzando i file Custom Liquid o Theme per il controllo completo

Utilizzando la posizione personalizzata aiuta a creare un'esperienza di deposito più senza soluzione di continuità e professionale, mantenendo il Convertitore di valute facilmente accessibile agli acquirenti. 🎯

Aggiornato il: 10/09/2026