🚀 Come posizionare il raccoglitore di slot sulla pagina del carrello
ℹ️ 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.
Ogni tema mette fuori la sua pagina Cart un po 'diverso — quindi il raccoglitore di slot dovrebbe sedersi esattamente dove ha senso per il tuo negozio 📍
Con il Posizione impostazioni Hoppy Delivery Dates, è possibile controllare dove il raccoglitore di slot appare sulla pagina Cart, come è allineato, e quanto è largo — separatamente per Desktop e Mobile.
📌 Prima di iniziare
- Hoppy Delivery Dates è installato e l'app incorporata è abilitata nel vostro tema
- Sei collegato al tuo Shopify admin
- (Opzionale) Se avete intenzione di utilizzare un selettore CSS personalizzato, aiuta a conoscere la struttura HTML del vostro tema — lo strumento di ispezione del browser è il vostro amico qui 🔍
Fase 1 — Aprire la pagina Aspetto
Nella navigazione app, vai a:
Hoppy Delivery Dates → Aspetto
Trova il Posizione carta — è la prima carta sulla pagina.
Passo 2 — Scegli una scheda dispositivo
La carta ha due schede:
- Desktop 🖥️
- Mobile 📱
Le impostazioni vengono salvate separatamente per ciascuna, in modo da poter ottimizzare la posizione per schermi più grandi e più piccoli. Configurare una scheda, quindi passare all'altra e ripetere se necessario.
Passo 3 — Scegliere Dove il raccoglitore appare
Sotto "Dove vuoi posizionare il segnatempo della data?", scegliere una delle opzioni radio:
- Predefinito (prima del pulsante di spunta o dell'estremità del modulo di pagina Cart) → l'app mette automaticamente il picker vicino al pulsante di checkout. Questo funziona fuori dalla scatola per la maggior parte dei negozi, dal momento che l'applicazione rileva il tema e utilizza un posizionamento corrispondente — nessuna configurazione necessaria ✅
- Prima di un elemento HTML → il raccoglitore è posizionato poco prima dell'elemento specificato
- All'inizio di un elemento HTML → il raccoglitore è posto all'interno dell'elemento, prima del suo contenuto esistente
- Alla fine di un elemento HTML → il raccoglitore è posto all'interno dell'elemento, dopo il suo contenuto esistente
- Dopo un elemento HTML → il raccoglitore viene posto subito dopo l'elemento specificato
Utilizzo di un selettore CSS personalizzato
Scegliere qualsiasi opzione diversa da Predefinito rivela un campo di testo in più. Inserire il selettore CSS dell'elemento desiderato.
- Esempio di segnaposto:
.cart_input - Esempio di classe:
.cart-footer - Esempio di identificazione:
#main-cart-footer
⚠️ Se il selettore CSS non corrisponde a nessun elemento nella pagina Cart, il raccoglitore di slot potrebbe non apparire affatto. Controllare il selettore utilizzando lo strumento di ispezione del browser e visualizzare sempre la pagina Cart dopo aver salvato per confermare che il raccoglitore è visibile.
💡 Se il raccoglitore scompare dopo aver impostato un selettore personalizzato, tornare a Predefinito e salvare — questo è il modo più veloce per ripristinarlo.
Passo 4 — Impostare l'allineamento
Scegliere come il raccoglitore si dirige all'interno del suo contenitore:
- Centro
- Sinistra
- Giusto.
Esempio
- Un tema ampio e minimale spesso sembra migliore con Centro
- Se il riepilogo del carrello si trova sulla destra, Sinistra può mantenere le cose bilanciate
Passo 5 — Impostare la larghezza del contenitore (opzionale)
Uso Larghezza del contenitore del raccoglitore di fessura per controllare la larghezza del raccoglitore è:
- Inserisci un numero nel campo di larghezza (ad es.
100) - Scegli l'unità dalla discesa accanto ad essa: % o p.
Esempio
100+%→ il picker si estende per riempire lo spazio disponibile400+px→ un picker compatto e fisso
ℹ️ Questo campo è facoltativo — lasciare vuoto per lasciare che il raccoglitore usi la sua larghezza naturale.
Passo 6 — Salva e controlla il tuo negoziofront
Fare clic Salva in cima alla pagina.
Poi aprire la pagina Cart del tuo negozio e confermare il picker siede esattamente dove lo volevi. Ricorda di controllare sia sul desktop che sul cellulare se hai configurato entrambe le schede 👀
⚠️ Note importanti
⚠️ Le posizioni Desktop e Mobile sono configurate in modo indipendente: cambiare una scheda non influisce sull'altra.
ℹ️ The Predefinito opzione è tema-consapevole: l'applicazione rileva il tuo tema e sceglie un posto adatto automaticamente, quindi è la scelta più sicura se non sei sicuro.
⚠️ Un selettore CSS sbagliato o obsoleto (ad esempio, dopo aver scambiato temi) è il motivo più comune che il raccoglitore smette di mostrare — ricontrollare prima se ciò accade.
🎉 Risultato finale
Una volta configurato con successo:
✅ Il raccoglitore di slot appare esattamente dove si desidera sulla pagina Cart ✅ Desktop e Mobile ogni ottenere il loro posizionamento ideale ✅ Allineamento e larghezza fanno sentire il raccoglitore come una parte naturale del vostro tema ✨
Aggiornato il: 10/09/2026
Grazie!