⚠️ Avviso importante Questa personalizzazione funziona solo con la versione 1 dei moduli del carrello di Upcart. Se hai recentemente aggiornato il tuo carrello alla versione 2, queste personalizzazioni potrebbero non funzionare. Dovrai usare i nuovi selettori forniti per la versione 2 nella guida alla migrazione. Se le tue personalizzazioni non funzionano come previsto, puoi riportare tu stesso il carrello alla versione 1: nel Cart Editor, usa il menu a tendina Cart version in cima al menu di sinistra e scegli V1.0 (Legacy). Il menu a tendina appare quando tutti i moduli del carrello sono sulla V2. Stiamo attualmente lavorando a nuovi template di personalizzazione per la versione 2 dei moduli, che saranno disponibili a breve.

Introduzione

Benvenuto in questo tutorial CSS, dove ti mostreremo come impostare la larghezza del tuo carrello mobile a zero a meno che non venga attivato da Upcart. È un modo pratico per tenere nascosto il carrello e semplificare l’esperienza di acquisto su mobile finché i tuoi clienti non sono pronti a visualizzarlo. Questa guida è pensata per proprietari di negozi o sviluppatori con conoscenze CSS di base. Usando questa personalizzazione, puoi tenere il carrello fuori dalla vista e migliorare il layout della pagina, riducendo le distrazioni e aiutando i tuoi clienti a concentrarsi sugli acquisti. È un piccolo ritocco che può fare una grande differenza nell’esperienza mobile del tuo negozio. Iniziamo e facciamo lavorare il tuo carrello mobile in modo più intelligente!

Accedere alle impostazioni Custom CSS

Per iniziare a personalizzare il CSS del tuo Upcart, segui questi passaggi:

Apri l’app Upcart dalla tua dashboard.
Vai al Cart Editor.
Apri Settings e seleziona la scheda Custom CSS (dietro More settings se la riga delle schede è troppo lunga).
Poi copia e incolla il codice nell’area di input CSS
Quando hai finito, clicca su “Save” e aggiorna la pagina del tuo negozio online per vedere i risultati live.

Ecco il codice CSS da copiare e incollare nella sezione CSS:

@media (max-width: 440px) {  
    .upcartPopupShow [class*="styles_CartPreview__right__"] {  
        width: 100%;  
        max-width: 440px;  
    }  
  
    [class*="styles_CartPreview__right__"] {  
        width: 0px;  
	max-width: 440px;  
    }  
}

Conclusione

Ed è tutto! Ora hai imparato come portare la larghezza del tuo carrello mobile a zero finché non viene attivato da Upcart, creando un’esperienza di acquisto più pulita e mirata.

🚧 Supporto per le personalizzazioni

Il team di supporto di Upcart non può assisterti nell’implementazione di soluzioni CSS o HTML personalizzate nel tuo carrello. Se hai bisogno di aiuto per progettare o personalizzare qualcosa su misura, ti consigliamo di consultare uno Shopify Expert: Vedi gli Shopify Expert

Per iniziare

Moduli del carrello

Impostazioni del carrello

Pulsante carrello fisso

Multicart

Personalizzazioni

Analisi

Integrazioni e compatibilità

Fatturazione e account

Risoluzione dei problemi

Imposta la larghezza del carrello mobile a zero finché non viene attivato da Upcart con il CSS

Introduzione

Accedere alle impostazioni Custom CSS

Ecco il codice CSS da copiare e incollare nella sezione CSS:

Conclusione

🚧 Supporto per le personalizzazioni

​Introduzione

​Accedere alle impostazioni Custom CSS

​Ecco il codice CSS da copiare e incollare nella sezione CSS:

​Conclusione

​🚧 Supporto per le personalizzazioni

Introduzione

Accedere alle impostazioni Custom CSS

Ecco il codice CSS da copiare e incollare nella sezione CSS:

Conclusione

🚧 Supporto per le personalizzazioni