Skip to main content

​
Panoramica

Questa sezione ti permette di modificare l’aspetto degli elementi esistenti del carrello o di applicare stili all’HTML personalizzato aggiunto tramite l’editor.

​
Dove trovarlo

Vai a:
Upcart > Cart Editor > Settings > Custom CSS
Settings è una fila di schede; Custom CSS è una di queste, insieme a Custom HTML. Se non è visibile, si trova dietro More settings.

​
Come funziona

Puoi aggiungere CSS per:
  • Dare stile agli elementi predefiniti del carrello
  • Modificare l’aspetto dell’HTML personalizzato
  • Regolare spaziatura, allineamento, tipografia e altro
Mentre digiti, un popup di completamento automatico suggerirà selettori Upcart validi per velocizzare la modifica. Selezionando un suggerimento, la regola viene completata automaticamente e ti aiuta a strutturare il codice. Se le modifiche non appaiono come previsto, consulta i suggerimenti comuni per la risoluzione dei problemi, come aggiornare le cache sia nel browser sia nell’editor di Upcart, verificare la posizione del CSS e assicurarti che le tue regole CSS abbiano la specificità adeguata.

​
Uso dei selettori

Upcart offre un’ampia gamma di selettori personalizzati. Fai clic su “Show list” per visualizzare tutte le opzioni disponibili. Evita di usare selettori globali come body, div o h3 a meno che non siano limitati con .upcart-cart, per evitare modifiche indesiderate al tuo negozio. Nelle situazioni in cui gli stili non vengono applicati correttamente, valuta di aumentare la specificità del CSS o di aggiungere !important alle tue regole CSS. In questo modo garantisci che prevalgano su eventuali stili in conflitto. Esempio:
Esempio (selettore sicuro):

​
Esempio: stile del messaggio di ringraziamento

Supponiamo che tu abbia aggiunto questo HTML personalizzato sotto il pulsante di checkout:
Senza CSS, il messaggio apparirà semplice. Per dargli uno stile:

​
Problemi comuni e soluzioni

​
Il CSS non appare sui dispositivi mobili

Se il tuo testo o i tuoi stili personalizzati non sono visibili su mobile:
  • Aggiorna la pagina sia nell’Upcart Editor sia nel browser mobile per cancellare le versioni memorizzate nella cache.
  • Assicurati che sia attiva l’ultima versione pubblicata del carrello.
  • Verifica che il CSS sia salvato nella scheda Custom CSS in Upcart > Cart Editor > Settings.

​
Discrepanze tra l’editor e il negozio live

Gli stili che appaiono correttamente nell’editor ma non sul sito live potrebbero richiedere una maggiore specificità dei selettori o l’aggiunta di !important alle regole principali.

​
Uso errato dei selettori CSS

Verifica che venga presa di mira la classe o l’ID corretto. Includi sempre prefissi come .upcart- per gli elementi specifici di Upcart, per evitare risultati indesiderati. Se lo stile non viene applicato come previsto, assicurati che il selettore .thank-you-message stia effettivamente puntando all’elemento HTML previsto e verifica che il codice CSS sia inserito nella scheda corretta (Upcart > Cart Editor > Settings > Custom CSS).
Supporto per le personalizzazioni: Il supporto di Upcart non può aiutarti a implementare o eseguire il debug di CSS personalizzato. Per un aiuto avanzato sugli stili, ti consigliamo di collaborare con un esperto Shopify. Per la risoluzione dei problemi del CSS personalizzato, consulta la sezione dei problemi comuni per indicazioni su come risolvere problemi come stili mancanti sui dispositivi mobili, discrepanze tra l’anteprima dell’editor e il negozio live e posizionamento errato dei selettori.